Question

I’m making a webapp, and I’d like an input field to show the Iphone’s number keypad.
I understand that type=number will make the keypad show the way I’d like.

The trouble is that type=number does not support placeholder text. So if I would like this:

Expiration Date:
[eg: 2010]

I can not get it to work, and also show the right keyboard.

Is there a way to force the iPhone keyboard into number mode without using the number input type?

Answer 1

Placeholder seems to work (in both Safari on my Mac as Mobile Safari on my iPhone; compatibility list).

<input type="number" placeholder="2010">

http://jsfiddle.net/XPL48/

Otherwise, use JavaScript to create a placeholder, e.g. this jQuery plugin: http://plugins.jquery.com/project/placeholder.