Input type="number" -> UIKeyboardTypeDecimalPad


#1

Hey there,

I’m having a problem trying to get the proper numeric keypad on iOS using input type=“number”

On Android, using type=“number” brings up a numeric keypad with nice big numbers and a decimal point, which is all great.
(image: https://motorola-global-portal.custhelp.com/euf/assets/images/faqs/JB/androidkeypad.png)

On iOS, using type=“number” brings up a keyboard that looks like the standard ABC keyboard but with a bunch of special characters, which is unwieldly to use for putting in number values.
(image: http://st1.bgr.in/wp-content/uploads/2013/06/ios-7-india-keyboard.jpg)

Changing the input type to “tel” turns the keyboard on iOS into a proper numeric keypad with the big ol number keys, but it doesn’t come with a decimal point character. (a period or comma)
Being able to input decimal numbers is crucial in this scenario, so I really need to find a way to force the numeric keypad to include a period or a comma symbol.

If anyone has any idea how to accomplish this, I’d really like to know!


#2

No one at all? I can’t be the only one with this issue.


#3

build your own “keyboard” -> instead of showing the native keyboardbuild your own keyboard with buttons.

Fake your “input” style an element like an input --> if you click on it --> open your “keyboard” e.g. --> open modal with big buttons for numbers or something like that.


#4

That’s a rather shit solution honestly, would it not be possible to set the keyboard type to UIKeyboardTypeDecimalPad in a homemade plugin or something?


#5

sure, but each crappy device manufacturer changes the keyboard-layouts like they want… see the htc or samsung number-picker --> they have nothing to do with the original ones.

and then it is not an ionic problem, because it is a native one.

Sure you can build your own plugin if you want and it works ;). Many people would be happy.


#6

Check out http://market.ionic.io/plugins/ion-numeric-keyboard for example.

iOS native “number” keyboard pretty much sucks and you can’t do nothing about it.


#7

Guys, i wrote a new plugin https://github.com/mrchandoo/cordova-plugin-decimal-keyboard

need feedback, if the implementation is on the right path.


#8

Thanks for the plugin. We just customized it according to locale.