Differences between Html.TextboxFor and Html.EditorFor in MVC and Razor

Question

Why by default were these changed when adding a new "edit" view? What are advantages when using EditorFor() vs. TextboxFor()?

I found this

By default, the Create and Edit scaffolds now use the Html.EditorFor helper instead of the Html.TextBoxFor helper. This improves support for metadata on the model in the form of data annotation attributes when the Add View dialog box generates a view.

Quoted from here.

does anyone have an example of how this is done? for example writing editorfor a DatePicker? — ShaneKm, Jan 28 '11 at 08:25

score 175 · Accepted Answer · answered Jan 28 '11 at 08:18

The advantages of EditorFor is that your code is not tied to an <input type="text". So if you decide to change something to the aspect of how your textboxes are rendered like wrapping them in a div you could simply write a custom editor template (~/Views/Shared/EditorTemplates/string.cshtml) and all your textboxes in your application will automatically benefit from this change whereas if you have hardcoded Html.TextBoxFor you will have to modify it everywhere. You could also use Data Annotations to control the way this is rendered.

There is a bug, probably in an old version. EditorFor doesn't recognize 'double'. For 'long' it considers it as 'int' and step="0.01" does not work in attributes so I used TextBoxFor and added @type='number' @step="0.01" so it worked — Charlie, Feb 01 '19 at 05:06

score 141 · Answer 2 · answered May 17 '13 at 09:52

TextBoxFor: It will render like text input html element corresponding to specified expression. In simple word it will always render like an input textbox irrespective datatype of the property which is getting bind with the control.

EditorFor: This control is bit smart. It renders HTML markup based on the datatype of the property. E.g. suppose there is a boolean property in model. To render this property in the view as a checkbox either we can use CheckBoxFor or EditorFor. Both will be generate the same markup.

What is the advantage of using EditorFor?

As we know, depending on the datatype of the property it generates the html markup. So suppose tomorrow if we change the datatype of property in the model, no need to change anything in the view. EditorFor control will change the html markup automatically.

great, simple answer which can easily absorbed even by a novice. — Kings, Feb 28 '15 at 18:06
above description will help this link https://forums.asp.net/t/1948071.aspx?EditorFor+and+EditorForModel — Amol Shiledar, Aug 24 '17 at 17:28
Is there ever a case where you should absolutely use TextBoxFor? — eaglei22, Mar 07 '18 at 21:25

score 56 · Answer 3 · edited Jul 23 '15 at 13:09

56

The Html.TextboxFor always creates a textbox (<input type="text" ...).

While the EditorFor looks at the type and meta information, and can render another control or a template you supply.

For example for DateTime properties you can create a template that uses the jQuery DatePicker.

edited Jul 23 '15 at 13:09

Mariusz Jamro

30,615
24
120
162

answered Jan 28 '11 at 08:19

GvS

52,015
16
101
139

12

Any Example on how to implement jquery datepicker using editfor ? – Peru Jan 09 '14 at 10:27
2

thanks for simplifying the difference by using the date-time case. – Kings Feb 28 '15 at 18:04
1

@Peru, [here](http://instinctcoder.com/asp-net-mvc-4-jquery-datepicker/) or [here](http://www.asp.net/mvc/overview/older-versions/using-the-html5-and-jquery-ui-datepicker-popup-calendar-with-aspnet-mvc/using-the-html5-and-jquery-ui-datepicker-popup-calendar-with-aspnet-mvc-part-4) is how to `implement jquery datepicker` and using it with `EditorFor` is [here](http://stackoverflow.com/a/23142692/2218697) – Shaiju T Aug 01 '15 at 09:48
What if one wants to use the jquery datepicker with TextBoxFor? – FloverOwe Nov 29 '21 at 17:52

score 8 · Answer 4 · edited Mar 17 '16 at 08:42

8

This is one of the basic differences not mentioned in previous comments:
Readonly property will work with textbox for and it will not work with EditorFor.

@Html.TextBoxFor(model => model.DateSoldOn, new { @readonly = "readonly" })

Above code works, where as with following you can't make control to readonly.

@Html.EditorFor(model => model.DateSoldOn, new { @readonly = "readonly" })

edited Mar 17 '16 at 08:42

Vikrant

4,920
17
48
72

answered Dec 23 '15 at 09:30

Lalitha1729

89
1
3

16

You can make EditorFor readonly using the following syntax: @Html.EditorFor(model => model.DateSoldOn, new { htmlAttributes = new { @readonly = "readonly" } }) – Doug Knudsen Apr 10 '16 at 20:38

score 4 · Answer 5 · answered Apr 12 '14 at 19:07

4

There is also a slight difference in the html output for a string data type.

Html.EditorFor:  
<input id="Contact_FirstName" class="text-box single-line" type="text" value="Greg" name="Contact.FirstName">

Html.TextBoxFor:
<input id="Contact_FirstName" type="text" value="Greg" name="Contact.FirstName">

answered Apr 12 '14 at 19:07

Greg Gum

33,478
39
162
233

2

it's absolutly wrong answer, becuase the key difference is that Texbox returns input and editorfor returns your template where input is default template for editorfor. – Artem A Sep 15 '15 at 10:28

Differences between Html.TextboxFor and Html.EditorFor in MVC and Razor

5 Answers5

Linked