Home/ Questions/Q 6254177
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-24T14:08:20+00:00

I have a view and it uses TextBoxFor helper method to edit model. Like

  • 0

I have a view and it uses TextBoxFor helper method to edit model. Like this:

<div class="editor-field">
                <%:Html.TextBoxFor(model => model.Property, new { @class = "mybox" })%>
                <%: Html.ValidationMessageFor(model => model.Property)%>
</div>

So, Modelbinder works fine and I can edit and save my model.

When I add html5 attributes ‘type’ and ‘step’ like this 

<div class="editor-field">
                <%:Html.TextBoxFor(model => model.Property, new { @class = "mybox",@type = "number", @step = "1" })%>
                <%: Html.ValidationMessageFor(model => model.Property)%>
</div>

I see beautiful numeric control instead of textbox, but modelbinding brakes and whenever I change my Property I recieve 0 in my model.Property on submit.

What’s wrong with my code?

That’s my simple model

public class Model
    {

        [DisplayName("Property")]
        public int Property
        {
            get;
            set;
        }           
    }

Nathan, my explanation of the problem is not precise here. Here Ajax Form breaks after adding html5 attributes in Chrome/Safari is a better description and workaround.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Give this a try:

    http://deanhume.com/Home/BlogPost/asp-net-mvc-html5-toolkit/29

    Based on your code, this works for me:

    Controller:

    public class IndexController : Controller
{

    public ActionResult Index()
    {
        return View();
    }

    [AcceptVerbs(HttpVerbs.Post)]
    public ActionResult Index(Model model)
    {
        return Content(model.Property.ToString());
    }

}

    Model:

    public class Model
{
    [DisplayName( "Property" )]
    public int Property
    {
        get;
        set;
    }
}

    View:

    <%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<BindTest.Models.Model>" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
        <title>Index</title>
    </head>
    <body>
    <%using( Html.BeginForm( "index", "index" ) ){ %>
        <div class="editor-field">
            <%=Html.TextBoxFor(model => model.Property, new {@class = "mybox", @type = "number", @step = "1"})%>
            <%=Html.ValidationMessageFor(model => model.Property)%>
        </div>

        <button type="submit" value="click Me">Click Me</button>

    <% } %>
    </body>
</html>

    When I click my submit button, the number selected in my numeric input control is received by the controller and output to the browser.

    We’ll need to see more code to be more helpful.

    • 0