A formatted numeric input with live thousands grouping, clamping, precision rounding and hold-to-repeat steppers. Try the arrow keys (Shift for ×10), Enter to commit, Esc to revert — every card is live.
'$' prefix, 2 decimals. Blur or press Enter to commit — the value is a plain number, never '$1,234.50'.
new NumberInput('#price', {
prefix: '$', precision: 2, min: 0
})
Integer steps with the +/− buttons — hold one down: 500 ms delay, 60 ms repeat, ×10 after 2 s.
new NumberInput('#qty', {
value: 1, min: 0, max: 500, step: 1
})
A ' kg' suffix and step 0.5 — precision is inferred from the step (one decimal).
new NumberInput('#weight', {
suffix: ' kg', step: 0.5, min: 0,
placeholder: '0.0'
})
Decimal comma, dot thousands: type 1234567,89 — or paste '1.234,56'.
new NumberInput('#euro', {
decimal: ',', thousands: '.',
precision: 2, suffix: ' €'
})
10–100. Type 500 — the border warns while typing, the commit clamps
it. Empty commits to null, not 0.
new NumberInput('#clamp', {
min: 10, max: 100, value: 50
})
With name, a hidden input carries the raw value — the
server never sees the formatting.
new NumberInput('#amount', {
name: 'amount', prefix: '$',
precision: 2, value: 1234.5
})
// → amount=1234.5