Textfield is the basic input field for both text and number for a while. Now we have number field, which is used to input number like integer and float.
<input type="number"> tag can help simplify your work when implementing entering numbers into a form.
On desktop, this field only accepts number. If you input characters, it refuses to type in the characters. On mobile, numpad is called when the field is focused.
<input class="form-control" min="0" max="10000" name="price" step="0.01" type="number" value="16">
- min: acceptable minimum value.
- max: acceptable maximum value.
- step: determine how input number is increased or decreased when using
- 1: it increases 1 every step.
- 0.01: it trigger decimal support and increases 0.01 every step.
- any: it trigger decimal support. However,
arrow upkey increases 1 integer value.
How to allow Input Number field to accept decimal values?
As in description above, you need to use
Any is used if you don’t want to restrict number of decimal digits.
By default, there are an arrow up and an arrow down at the end of input field. It doesn’t look good so we need to remove these arrows.
Note: Input Number doesn’t support IE below 10.