asp.net-mvc 如何在 Html.TextboxFor 上强制大写

How to force uppercase on a Html.TextboxFor

提问by Bronzato

I would like to force uppercase on a textbox in my view. So when user type something in the textbox, either the text is immediately converted in uppercase or (an alternative) the text is converted in uppercase when the form is submitted and the model is populated with data (in the action controller). Maybe there are some CSS or jquery solutions but I prefer some MVC solutions (if possible).

在我看来，我想在文本框上强制大写。因此，当用户在文本框中键入内容时，文本会立即转换为大写，或者（另一种选择）在提交表单并且模型填充数据（在操作控制器中）时将文本转换为大写。也许有一些 CSS 或 jquery 解决方案，但我更喜欢一些 MVC 解决方案（如果可能的话）。

Here is my view:

这是我的观点：

@model Domain.Entities.ProjectTechnology

<script src="../../Scripts/Admin/_AddProjectTechnology.js" type="text/javascript"></script>

<div class="editor-label">Technologies</div>    

<div class="editor-field">

    @using (Ajax.BeginForm("_AddProjectTechnology", new AjaxOptions { HttpMethod = "POST",
                                                                  UpdateTargetId = "RemoveProjectTechnology",
                                                                  InsertionMode = InsertionMode.Replace,
                                                                  OnComplete = "AddProjectTechnologyCompleted" })) {    
        @Html.ValidationSummary(true)
        @Html.HiddenFor(m => m.ProjectID)
        @Html.EditorFor(m => m.TechnologyID)
        @Html.ValidationMessageFor(m => m.TechnologyID)          
    }
</div>

And here is my model:

这是我的模型：

public class ProjectTechnology
{
    public int     ProjectID   { get; set; }
    public string  TechnologyID    { get; set; }
}

The textbox in question is this line: @Html.EditorFor(m => m.TechnologyID)

有问题的文本框是这一行：@Html.EditorFor(m => m.TechnologyID)

How can I proceed ?

我该如何继续？

Thanks.

谢谢。

采纳答案by Darin Dimitrov

You could perform this conversion on the getter of the property:

您可以在属性的 getter 上执行此转换：

public class ProjectTechnology
{
    public int ProjectID { get; set; }

    private string _technologyId;
    public string TechnologyID 
    {
        get 
        {
            if (string.IsNullOrEmpty(_technologyId))
            {
                return _technologyId;
            }
            return _technologyId.ToUpper();
        }
        set
        {
            _technologyId = value;
        }
    }
}

回答by leifbattermann

The easiest way is IMO:

最简单的方法是 IMO：

@Html.EditorFor(m => m.TechnologyID, new { htmlAttributes = new { @style = "text-transform:uppercase" } })

回答by Felipe M. Martins

For EditorFor:

对于编辑对于：

@Html.EditorFor(model => 
    model.Nome, 
    new { 
        htmlAttributes = new { 
            @class = "form-control", 
            @onkeyup = "InputToUpper(this);"
        } 
    }
)

回答by Pete Swinford

My line of code in the view is:

我在视图中的代码行是：

@Html.TextBoxFor(model => model.BldgNameAbbv, new {onkeyup="InputToUpper(this);"})

The associated script is:

相关的脚本是：

<script>
function InputToUpper(obj)
{
    if (obj.value!="")
    {
    obj.value = obj.value.toUpperCase();
    }
}
</script>

This worked for me. And using TextBoxFor, instead of EditorFor, was essential.

这对我有用。使用 TextBoxFor 而不是 EditorFor 是必不可少的。

回答by Yaroslav Bigus

You can use text-transform: uppercaase css property. If you want to make this from mvc, you can try create template for textbox(where you output input with css class for uppercase) and use UIHint attribute in the model. Hope this help you.

您可以使用text-transform: uppercaase css 属性。如果你想从 mvc 做这个，你可以尝试为文本框创建模板（你用大写的 css 类输出输入）并在模型中使用 UIHint 属性。希望这对你有帮助。

回答by Messiah

Also see this:

另请参阅：

@Html.EditorFor(m => m.TechnologyID, 
      new { @class = "whatever-class",  
      @style = "text-transform:uppercase"})

回答by Alfred Tinsley

I looked at changing my getter and settter in my Model but in my case I am using DB first so if I make a change to my db structure I would have to put the getter and setter code back every time. This would be hard for us to manage in future.

我看着在我的模型中更改我的 getter 和 setter，但在我的情况下，我首先使用 DB，所以如果我对我的 db 结构进行更改，我将不得不每次都放回 getter 和 setter 代码。这对我们将来很难管理。

I tried;

我试过;

@Html.EditorFor(m => m.Lname, 
  new { @class = "whatever-class",  
  @style = "text-transform:uppercase"})

but as stated above this only makes it capital on the View. When you save it to the DB the data appears how ever the user entered it.(GIGO) For our site I am needing it to be upper case in the DB as well. So what I did to solve this issue was to set the property of my object to itself along with .upper(), on the post action method Ex:

但如上所述，这只会使它成为视图的资本。当您将其保存到数据库时，数据会以用户输入的方式显示。（GIGO）对于我们的站点，我也需要它在数据库中为大写。所以我为解决这个问题所做的是将我的对象的属性与 .upper() 一起设置为自身，在 post action 方法 Ex 上：

[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Edit([Bind(Include = "Recid,FName,LName")] UserModel change)
    {
        change.LName = change.LName.ToUpper();
        change.FName = change.FName.ToUpper();
        .... //code to update table
    }

So combined with the CSS style on the front end and setting the property in the post I have upper cases on both the Front and Back end.

所以结合前端的CSS样式并在帖子中设置属性，我在前端和后端都有大写。

回答by Derek

If you want to simply prevent saving to the DB as lower case then the most straight forward option is to alter the value to upper case during the HttpPost of the Create and Edit Actions e.g.

如果您只想防止以小写形式保存到数据库，那么最直接的选择是在创建和编辑操作的 HttpPost 期间将值更改为大写，例如

[HttpPost]
[ValidateAntiForgeryToken]
public async Task<IActionResult> Create([Bind("ProjectID, TechnologyID ")] ProjectTechnology projectTechnology)
    {
        ProjectTechnology.TechnologyID = ProjectTechnology.TechnologyID.ToUpper();

        if (ModelState.IsValid)
        {
            _context.Add(person);
            await _context.SaveChangesAsync();