New! HTML5 Mobile Inputs Documenation

Hey friends, we wrote and released an overview of HTML5 input types and how to change which virtual keyboard to show on mobile devices. Definitely a useful reference when putting together different forms.

Yeah sorry, this is only a simulation of what the virtual keyboard would look like, it doesn't actually do anything on dekstop browsers (it's just an image).

Thanks, it’s amazing ahahahah

Thanks, I used most of them already.

Awesome. Others include:

  • Time
  • Range (already in the docs)
  • URL
  • and File (not sure about this one though!)

Disclaimer: only used my iPhone to quickly test them! No idea about Android.

Android support input type date but without a datepicker like iOS or i missing something? Maybe there would be good to add a small note on the documentation.

And for the completeness:

  • week :wink:

Anyway good job

Does anyone support week? It doesn’t seem to be…

In the actual iOS Safari HTML Reference - last update on 2013-10-22 - week input type is present.
I remeber only datetime input type support was removed.

1 Like

@adam and I can look into it this week. Of course, this is the very first version of this page, so plan on it getting some updates and additions over time. :smile:

Edit: Thanks for the info on that, @xAlien95!

There also <input type="text" pattern="[0-9]*"/> to force a number keypad only input on iOS.

This is the ultimate thing which is mask the mobile or phone number without validate

<pre><div ng-controller="SignUpController" >
   <label class="item item-input">
                            <input type="text" placeholder="Mobile No" ng-model="mob_no" name="mob_no" ng-maxlength="10" ng-minlength="10" maxlength="10" minlength="10" valid-number>
app.directive('validNumber', function() {
return {
    require: '?ngModel',
    link: function(scope, element, attrs, ngModelCtrl) {
        if(!ngModelCtrl) {

        ngModelCtrl.$parsers.push(function(val) {
            var clean = val.replace( /[^0-9]+/g, '');
            if (val !== clean) {
            return clean;

        element.bind('keypress', function(event) {
            if(event.keyCode === 32) {


work on Nexus 4 and Android 4.4.1 ( and also for datetime)

1 Like

The date type defaults to the browsers native function. Most desktop browsers don’t do a native date. So, you won’t see one there. Mobile devices have built-in data pickers.

Is that what you mean? If not, setup a simple CodePen sample to show us your problem.

Does android have a native type=“date” datepicker? In my Nexus 7 it is not working.

It does, but it’s only on android 4.4

It depends on browser beacuse cordova uses Webview.
You can check it using your mobile browser and point it to
or using

Thanks ,introduce these input types .there is a problem.i not want to use this “done” tag on keyboard. click here ,and i just want to like this .click here .I don’t know how to do。Do you know how to deal with?