what input field type forces the number pad mobile keyboard to come up when focused?

Viewed 78045

I tried the <input type="number" /> but on Opera that outputs a strange input box coupled with an "up and down" handler. What I expected was a regular text field that once you focus on it prompts the number keyboard instead of the alphabets. Is that even possible?

p.s. I'm not trying to validate. It would be a nice user experience, that's all.

6 Answers

This will work on mobile and will prevent the letter "e" (along with all other letters) from being allowed to be typed in in the desktop version of your page. type="number" by itself still normally allows "e" per spec:

<input pattern="[0-9]*" type="text" oninput="this.value=this.value.replace(/[^0-9]/g,'');">

If you use type="number" in the above, then if you type "123" then "e" the oninput JS will replace all contents of the box. Just use type="text" if you really just want integer values.

Try <input type="number" pattern="/d*"> OR <input type="tel" pattern="/d*"> This will help if you working with Android.

Related