15
Views
2
Comments
 Numeric inputs keyboard for Mobile with Maxlength
Question

Good Day!

I am having a problem in setting an input type text to have a  Numeric inputs keyboard for Mobile with maxlength. I tried to use the input type number but max length doesn't work for this type of input so in this case I tried to use max attribute in html but this attribute is only limited for length of 10 in integer type and 18 for long integer, I also tried to use inputmode = numeric but it doesn't work too.


NumericKeyboard.PNG

Rank: #494

Hi,

I think you should do some change:

  1. change the type = number
  2. remove inputmode
  3. replace maxlength with max and the value of max = maximum value  of the number of character. For example, if max length you want is 5, so the maxi = 99999

Hope this help

mvp_badge
MVP
Rank: #19

Hi Gerald,

In order to have the device show you the numeric keyboard, the simplest way is to make sure the Input Type is set to Number.

If you want to further restrict what can be typed, you may need to resort to a component like the Input Mask Mobile that use JavaScript to limit what the input itself accepts or how it displays it.

If the suggested component still doesn't work, you may need to implement it yourself with a quick JavaScript check as mentioned here, as max and min HTML attributes seem to impact only the spinner buttons at least on some browsers.

Hope this helps!