HTML5 Number/Numeric for ASP.NET Textbox

Problem

• ASP.NET 4.0 Web Forms
• I want to use HTML5 number input textbox
• I’m targetting html5 modern browser, e.g. Chrome, Apple Safari

Solution

With the latest NET 4.0 update, you can override input type of asp:Textbox to any html5 type. You can use type number by adding type=”number” to asp:Textbox.

<asp:TextBox ID="TextBox1" runat="server"
  placeholder="number"
  type="number"></asp:TextBox>

It will be rendered with spinboxes as shown below in Chrome and Safari. You can check “Can I Use” for list of browsers that support input type=number.

Notes
This only works after you install Update for the .NET Framework 4. And your project target framework must be NET 4.0 and above.

Feature 3
New syntax lets you define a TextBox control that is HTML5 compatible. For example, the following code defines a TextBox control that is HTML5 compatible:

<asp:textbox runat="server" type="some-HTML5-type" />