CODEWITHSUNDEEP
htmlcssregex
user7474176
user7474176

Reputation:

Number input. HTML

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.

Upvotes: 0

Views: 316

Answers (3)

Rahul
Rahul

Reputation: 2071

<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.

Upvotes: 0

Johnny
Johnny

Reputation: 576

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"

/>

Upvotes: 1

Lal
Lal

Reputation: 14820

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}">

Upvotes: 0

Related Questions