html5 input type number with regex pattern in mobile

Question

I\'m trying to get regex pattern in input type number to show only numbers and dots. I tried something like this.

Answer 1

I had a similar scenario whereby I needed to support both comma and point as both the decimal mark and digit grouping [see here]

E.g.

1.00 / 1,00
1,000,000.00 / 1.000.000,00

At the same time the scenario required that the number keypad was displayed on mobile devices.

The initial implementation combined the 'number' type with the pattern attribute.

However the number validation failed inputs that the pattern would allow. This meant the field and thus form were marked as invalid.

The solution was to change the type to 'tel'.

Mobile users would now see a number keypad by default, and the pattern validation would be used to validate the input.