Naively supported using HTML5:
<input
class = "form-control"
placeholder = "Total Days"
id = "total_days"
name = "total_days"
type = "number"
step = "0.5"
min = "0"
max = "35"
required />
Defining the type as number
and using thestep
value to control which numbers are valid (along with max
and min
), which defaults to 1
. This value is also used by implementations for the stepper buttons (i.e. pressing up increases by step
).
Simply change this value to whatever is appropriate. For using money values, two decimal places are usually expected:
<input type="number" step="0.01">
(also set min=0
if it can only be positive)
If preferred to allow any number of decimal places, then use step="any"
(though for currencies, it's recommended sticking to 0.01
). In Chrome & Firefox, the stepper buttons will increment / decrement by 1 when using any
.
Additionally, local localization will be supported such as French with the usage of a comma (,) instead of a period (.) for the decimal point.