Html.EditorFor Tutorial with Exmaple – ASP.NET MVC

In this tutorial, you will learn:
  1. What is Html.EditorFor Helper Method in ASP.NET MVC?
  2. How to define Html.EditorFor
  3. Difference Between Html.TextBox and Html.EditorFor
  4. Programming Example

Html.EditorFor helper method render input control like a textbox but the difference is that Html.EditorFor helper method renders input control based on datatype. It provides great handling over input control than a textbox control.

For example, if you defined a string property, int property and Boolean property in model class, the EditorFor Extension method automatically renders suitable input control based on data type.

Programming Example

Model: UserModel.cs
namespace HtmlHelperDemo.Models
{
    public class UserModel
    {
        public string UserName { get; set; }  
        public int Age { get; set; }             
        public string City { get; set; }
        public bool isHandicapped { get; set; }
    }
}

View: Index.cshtml
@using HtmlHelperDemo.Models
@model UserModel

<h1>Html.NameFor Example</h1>

@using (Html.BeginForm("Index", "Home", FormMethod.Post))
{
    <strong>Name </strong> @Html.EditorFor(m => m.UserName)<br /><br />
    <strong>Age </strong> @Html.EditorFor(m => m.Age)<br /><br />
    <strong>City </strong> @Html.EditorFor(m => m.City) <br /><br />
    <strong>Handicap </strong> @Html.EditorFor(m => m.isHandicapped)<br /><br />
    <input id = "Submit" type = "submit" value = "submit" />
}

Output Html.EditorFor Example
 

Share your thought