iPhone Web App Number Pad with Decimal

The numeric keyboard with decimal input was only made available to native apps in iOS 4.1 (specifically the UIKeyboardTypeDecimalPad keyboard type in the UITextInputTraits protocol). Previously, it was necessary to hack around the limitation of the missing decimal point using the UIKeyboardTypeNumberPad as a starting point.

Unfortunately, this functionality doesn't yet seem to have percolated through to MobileSafari (or UIWebView) and Apple's only documentation on the feature is here, which unfortunately only documents what you've already discovered.

One thing that the Apple documentation doesn't mention is that you can specify <input type="number"> (a new attribute value in HTML5), which will start the user on the number and punctuation keyboard that's normally accessed by pressing the ".?123" button to the bottom left of the default text keyboard.

I'd probably take this approach for now and hope that support for UIKeyboardTypeDecimalPad is somehow added in iOS 5.

(Incidentally, input elements with their type attribute set to number are supposed to support floating point numbers, as per the HTML5 spec. I suspect this is why Apple presents the full keyboard in this case - floating point numbers can legitimately contain minus and plus signs and lower case or upper case 'E's, none of which are supported with UIKeyboardTypeDecimalPad)


Problem with <input type="number"> is that is will only except integers. I found this where he mentions adding step="any" to the input tag. Now you get the numeric keypad and can enter decimals.