How to force Razor to make Editorfor to input number type for float variable?

Question

Here is my code in MVC 5:

@Html.EditorFor(model => model.myfloatvalue, new { @type = \"number\", @min = \"0\", @step = \"0.01\", @value = \"0\" })
         


        

Answer 1

You can actually change the default behaviour for the EditorFor for a float so that it produces type="number" instead of type="text".

To do that you need to add a custom EditorTemplate for the Single (not float) type to /Views/Shared/EditorTemplates/Single.cshtml as follows:

@model Single?

@{
    var attributes = HtmlHelper.AnonymousObjectToHtmlAttributes(ViewData["htmlAttributes"]);
    if (!attributes.ContainsKey("type")) { attributes.Add("type", "number"); }
}
@Html.TextBoxFor(m => m, attributes)

The reason this works is that float is a C# alias for System.Single (see the Microsoft c# Language Reference for more details on that). Adding an EditorTemplate called Float.cshtml will not work (I tried...).

I got the idea for this from @Stephen Muecke's excellent answer to my question here. He also mentions the idea of creating your own HtmlHelper extension so you could then write @Html.FloatFor(...).

This same approach can also be applied to Decimal and Double, both of which also render type="text" by default.