Oliver Oliver - 1 year ago 89
HTML Question

html pattern="[A-Za-z]{50}" is saying valid input is invalid

I have a page with some text fields and I would like to restrict user input, so I have used the html5 pattern attribute, like so:

<input name="team_name" type="text" pattern="[A-Za-z]{50}" value="<?php echo $team_name;?>">

This should allow me to enter only letters b/w Aa-Zz for a name, but when I try to enter a valid name, it still tells me to match the requested format.
What am I missing? How come it is always telling me that my input is invalid?

Answer Source

The rule [A-Za-z]{50} will make the name acceptable only when it contains exact 50 alphabets.


This will make the name minimum 10 and maximum 50 characters. Update the expression according to your requirements.


input:invalid {
  color: red;
  <input name="team_name" type="text" pattern="[A-Za-z]{10,50}" value="">
  <br />
  <input type="submit">

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download