Monday, August 12, 2013

Decimal Numbers in HTML5 Input Number

The HTML5 number input element type helps eliminate the need to validate numeric input through client-side Javascript as the validation would be performed by the web browser. However, one common problem faced by web developers is that the number input element type indicates that any number with a decimal point is invalid input.

This is because, by default, the step for the number input element type is 1 therefore the validation enforces the use of whole numbers. You can enforce the number of decimal points by setting the step to a value such as 0.1 for one decimal place, or you can set step="any" to allow any number of decimal places. You would therefore have something like the following:

<input step="any" type="number" />

No comments: