CODEWITHSUNDEEP
javascripthtmlforms
KB_Shayan
KB_Shayan

Reputation: 652

HTML Implementing MaxLength but ignoring decimals

I'm implementing a text box in HTML with the MaxLength attribute. I want it to be 4 digits only but ignoring decimals. So a user should only be able to write a number from 0 to 9999. however, I want them to be able to add decimals like 9011.22. What would be the best way to go about implementing this? Will it need some kind of javascript?

here is my HTML tag:

<input type="text" name="lastname" value="Mouse">

Upvotes: 0

Views: 664

Answers (1)

Get Off My Lawn
Get Off My Lawn

Reputation: 36309

Use the number type, it will allow you to set a min and a max. You can then use the step attribute to control the number of decimals.

  • You can add the required property to make this field required.
  • You can use this.checkValidity() in the onblur event to validate before submitting.

<form>
  <input type="number" name="lastname" value="Mouse" min="0" max="9999" step="0.01">
  <p><input type="submit" value="Submit"></p>
</form>

Upvotes: 2

Related Questions