Render asp.TextBox for html5 input type="date"

Question

Hello. I don't know if it has been asked before, couldn't find it either.

Is it possible to control the type of the input text that is rendered by an asp:TextBox? I would like to change it to <input type="date">

any suggestions or comments are welcome, thanks

Answer 1

Hi,

Actually there is no easy way to override the type attribute in standart asp:TextBox. You can simly use an input element

Here is an example

<input type="date" id="Input1" runat="server" />

Let me know if it helps...

Answer 2

Here is how I did it... hope it helps...

Add a new item to your project of the type "JScript File", then paste this code in:

var setNewType;
if (!setNewType) {
setNewType = window.onload = function() {
    var a = document.getElementsByTagName('input');
    for (var i = 0; i < a.length; i++) {
        if (a[i].getAttribute('xtype')) {
            a[i].setAttribute('type', a[i].getAttribute('xtype'));
            a[i].removeAttribute('xtype');
        };
    }
}

Now add this line into your aspx page after the body tag (change the file name to whatever you called it above!):
<script type="text/javascript" src="setNewType.js"></script>

Finally, add something like the following to your code behind PageLoad ( I used VB here):

aspTxtBxId.Attributes("xtype") = "tel" ' or whatever you want it to be

The important part above is the Attributes.("xtype"), as it places the attribute XTYPE in the rendered html for the "textbox", which the javascript then finds and uses to replace the original "type" attribute.

Good Luck!
FJF

Answer 3

I went the route of building my own set of html5 inputs by building custom controls. I get the custom keyboards on iPad and iPhone plus the postback coding of true asp.net controls. It worked for my inhouse project, so I decided to license the whole suite to save other people the time and trouble of doing it from scratch.

Hope this helps!