How to get input of exact length?

Question

How to set the input value of a text field to be exact? I want to get a document number of exactly 10 digit from user. The following two does not work at the same time:

var input = document.createElement("input"); 
input.setAttribute("min","10") 
input.setAttribute("max","10")

Possible duplicate of [Is there a minlength validation attribute in HTML5?](https://stackoverflow.com/questions/10281962/is-there-a-minlength-validation-attribute-in-html5) — Gonzalo.-, Mar 22 '19 at 21:40

Get Off My Lawn · Accepted Answer · 2019-03-22T22:01:25.117

4

Note: min/max are only valid on type="number" or type="date" inputs.

This can be done with pure html. You can set the field to type="number" and require the min value to be 1000000000 (10 digits) and a max value of 9999999999 (also 10 digits). Then just tack on the required parameter on the field. The form won't submit unless it validates due to the required parameter.

<form action="">
  <input type="number" min="1000000000" max="9999999999" required>
  <input type="submit" value="send">
</form>

Another thing we can do is use a pattern on a text input with required:

<form action="">
  <input type="text" pattern="[0-9]{10}" required>
  <input type="submit" value="send">
</form>

edited Mar 22 '19 at 22:01

answered Mar 22 '19 at 21:42

Get Off My Lawn

34,175
38
176
338

`999999999999999999999999999999999999999` is submitted, but its length is not 10 as OP requested – Gonzalo.- Mar 22 '19 at 21:45
Instead of 100000000 and 999999999 can't we just specify the required length of input – CriticalRebel Mar 22 '19 at 21:51
If you use a pattern as shown in the second example, that one blocks letters as well. – Get Off My Lawn Mar 22 '19 at 21:53
Okk will it then. Thanks – CriticalRebel Mar 22 '19 at 21:54

How to get input of exact length?

1 Answers1