Decimal inputmode

Pattern Checker

What does this mean?

An input has been found using inputmode="decimal".

For example:


<label for="amount">How much do you want to pay?</label>
<input type="text" id="amount" inputmode="decimal">

Impact on users

This attribute should present mobile users with a number-centric keypad along with decimal point symbols (localised), similar to the one below:

An Android keypad showing numbers along with options for comma and decimal point

However it has been found that not all devices will actually show the decimal point / comma options, making it impossible for the user to enter data correctly. This test data is from 2020 so needs to be revisited.

How to fix

Avoid using the decimal value. Leave the type set as plain text.

For example:


<label for="amount">How much do you want to pay?</label>
<input type="text" id="amount">

References

Classification

Level: warn
Tagged: best-practice

See all issues