How can I use HTML5 email input type with server-s

Question

As I understand it, the <input type=email> element in HTML5 will render as a simple text field in browsers that do not support the tag. On other browsers it will render properly, like on the iPhone it will bring up the e-mail keyboard layout.

I’d like to use this in a project but my input fields are <asp:TextBox> controls. How can I use the HTML5 element but still access its data server-side like the rest of my fields?

Answer 1

Whether or not it is accessible as a server control, you should be able to access the HttpRequest.Form collection and retrieve the value. No matter what the browser does with the tag, it has to submit a string to the server.

Answer 2

Sorry I'm a bit late to the party, though I think that others can benefit from what I did. I have a page which is HTML 5 though we still have .NET 3.5. We wanted to keep the .NET element, though have the type change to email. I've tried several methods (including Milox above) to no avail, though the one which worked for me was the following: I added a JavaScript property to the element itself inline (when I put it in a script tag it wouldn't pick up for some reason...) Here is what your tag would look like if you use my changes:

<asp:TextBox runat="server" type="email" onfocus="this.type='email'"/>

Eli

Answer 3

in your .aspx file add

<input type="text" required autofocus placeholder="Email Address"
class="txt-input txt-input-username" ID="myTextBox" runat="server"/>

in your Code Behind .cs

myTextBox.Attributes["type"] = "email";

This Worked For Me

Answer 4

you can try adding the attributes manually, like:

TextBox1.Attributes["type"] = "email"; 
TextBox1.Attributes["type"] = "url"; 
TextBox1.Attributes["type"] = "number"; 

Answer 5

You need to create your own custom control and override the Render routines. Feel free to use either the source code or DLLs

Answer 6

There is an update for .NET framework 4 which allows you to specify the type attribute

http://support.microsoft.com/kb/2468871.

See feature 3 way down the page

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" />