regex - How to allow only 4 digit numbers in html textbox?

Question

I have tried to restrict users in HTML text box to insert only 4 digit numbers 0-9.

I have tried as follows but it restrict only to allow two digit numbers.

<input type="text"  name="pincode" maxlength="4"  id="pin" pattern="^0[1-9]|[1-9]d$" required/>

Answer 1

Let me clarify: any of the ^[0-9]{4}$ or ^d{4}$ are valid regexps to restrict values to 4 digits only. However, pattern HTML5 attribute value is already anchored by default:

The regular expression language used for this attribute is the same as that used in JavaScript, except that the pattern attribute is matched against the entire value, not just any subset (somewhat as if it implied a ^(?: at the start of the pattern and a )$ at the end).

So, use just pattern="d{4}":

input:valid {
  color: green;
}
input:invalid {
  color: red;
}

<form name="form1"> 
 <input type="text"  name="pincode" maxlength="4"  id="pin" pattern="d{4}" required/>
 <input type="Submit"/> 
</form>