Number input. HTML

Question

How can I create the number input in which user will be able to type only numbers which consist of five digits? I tried this but user still can type as many digits as he/she wants.

 <input type="number" placeholder="1" min="1" max="99999">

There is no opportunity to use JavaScript in my project.

Possible duplicate of [How can I limit possible inputs in a HTML5 "number" element?](http://stackoverflow.com/questions/8354975/how-can-i-limit-possible-inputs-in-a-html5-number-element) — Erick Petrucelli, Jan 26 '17 at 14:29
Possible duplicate of [maxlength ignored for input type="number" in Chrome](http://stackoverflow.com/questions/18510845/maxlength-ignored-for-input-type-number-in-chrome) — Rando Hinn, Jan 26 '17 at 14:30

score 1 · Accepted Answer · answered Jan 26 '17 at 14:29

1

You can try the below:

 <input name="somename"
oninput="javascript: if (this.value.length > this.maxLength) this.value = this.value.slice(0, this.maxLength);"
type = "number"
maxlength = "5"

/>

answered Jan 26 '17 at 14:29

Johnny

553
1
10
27

The OP said: "there is no opportunity to use JavaScript in my project". – Erick Petrucelli Jan 26 '17 at 14:34

score 0 · Answer 2 · answered Jan 26 '17 at 14:29

0

You can use HTML5 'pattern' attribute.

According to the docs

The pattern attribute specifies a regular expression that the element's value is checked against.

For your case, you can add a pattern attribute to the HTML as follows

pattern="[0-9]{5}"

[0-9] specifies that the character entered should be a number and {5} specifies that there should be 5 digits.

Thus your complete HTML would be as follows

<input type="number" placeholder="1" pattern="[0-9]{5}">

answered Jan 26 '17 at 14:29

Lal

14,726
4
45
70

The OP is talking about how many numbers the user can type while typing, i.e. `maxlength`. What doesn't exists for ``. – Erick Petrucelli Jan 26 '17 at 14:33

score 0 · Answer 3 · answered Jan 26 '17 at 14:36

<input type="text" placeholder="1" required="required" pattern="[0-9]{1,5}" />

/* 
   Pattern
   0-9 = Only number.
   1,  = Minimum length,
   5  = Maximum Length
*/
/*required="required" attribute also needed*/

Best way if you use JavaScript form validation. Thanks.

Number input. HTML

3 Answers3

Linked

Related