Autofocus on EditorFor

前端 未结 4 1149
梦谈多话
梦谈多话 2021-01-11 22:51

I would like to autofocus on an editorfor in my application, but I can\'t seem to do that. I have successfully used autofocus on a textbox, but I would like to use an editor

相关标签:
4条回答
  • 2021-01-11 23:23

    Using .Net Framework 4.5 and MVC 5, this works for me:

    @Html.EditorFor(model => model.Description, new {
        htmlAttributes = new {
            @class = "form-control",
            autofocus = true
        }
    })
    
    0 讨论(0)
  • 2021-01-11 23:34

    You put the autofocus attribute in the wrong spot.

    @Html.EditorFor(model => model.Description, 
         new { htmlAttributes = new { @class = "form-control" }, autofocus = "" })
    

    Try this instead:

    @Html.EditorFor(model => model.Description, 
         new { htmlAttributes = new { @class = "form-control", autofocus = "" } })
    
    0 讨论(0)
  • 2021-01-11 23:34

    I've been following this thread and I may have stumbled on an answer to your question about autofocus on EditorFor - this is all Asp.Net 4.5 and MVC 5, not that it matters.

    1. In the Scripts folder I have a jQuery script file:

      $(function(){ $('.someclassname').focus(); });

    I add the script name to the BundleConfig and render it in the view.

    1. In the view I add the classname to the EditorFor <div class="col-md-10" someclassname">
    2. I then add the type="text" autofocus="autofocus" to the EditorFor's @class. So, new{@class="form-control", type="text", autofocus="autofocus"
    3. That's pretty much it, when the DOM loads the .someclassname field gets the cursor focus... PS. In fact if you just do (3) it works also...
    0 讨论(0)
  • 2021-01-11 23:37

    This s because you are using EditorFor instead of something specific like TextBoxFor.

    @Html.TextBoxFor(model => model.Name, new { htmlAttributes = new { 
                        @class = "form-control" }, autofocus="autofocus"})
    

    Or you can do that using jQuery:

    <div class="editor-field focus">
        @Html.EditorFor(model => model.Description)
        @Html.ValidationMessageFor(model => model.Description)
    </div> 
    $(function() {
        $('.focus :input').focus();
    });
    

    Update:
    As you know TextBoxFor always creates a textbox with type input, But EditorFor is a little bit smart, it renders markup based on the datatype of the property.

    0 讨论(0)
提交回复
热议问题