CODEWITHSUNDEEP
javascripthtmlforms
krupal
krupal

Reputation: 884

How to input float numbers in HTML form?

my code is as follows:

<input type="number" min="4.50" max="9.90"  id="cpi" name="cpi" required="required" title="CPI" class="formfield3" />

CPI is a float value. But if I open it in browser and input value which is the float number such as 7.89 then it shows message of 'Invalid Value'. How to solve it?

Upvotes: 4

Views: 12082

Answers (2)

tchow002
tchow002

Reputation: 1098

Set step="any"

<input type="number" min="4.50" max="9.90" step="any" id="cpi" name="cpi" required="required" title="CPI" class="formfield3" />

Upvotes: 11

Ashish Chopra
Ashish Chopra

Reputation: 1439

The number type has a step value controlling 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 money, two decimal places are probably expected:

<input type=number step=0.01 />

(I'd also set min=0 if it can only be positive)

As usual, I'll add a quick note: remember that client-side validation is just a convenience to the user. You must also validate on the server-side!

Upvotes: 6

Related Questions