CODEWITHSUNDEEP
javascriptregexhtml
lonewolf
lonewolf

Reputation: 1

Trouble with HTML5 form patterns

I'm programming a little HTML form with pattern included in a tag where a phone number must be introduced. Problem is I can't make the pattern to work as intended. Even if the desired pattern is introduced it still won't let submit the form. It's pretty obvious there's a problem in the pattern but can't figure out what (seems OK to me, but I'm no good with patterns).

The format to be accepted is XXX-XXXXXX, with X being numbers. Here's the code in that <input> tag so far:

<input type="text" name="phonenum" id="phonenum" maxlength="10" pattern="/^\d{3}-\d{6}$/" required="required">

Same pattern is working in an alternate JavaScript validation file. I don't know what must be changed for it to work as a tag pattern.

Upvotes: 0

Views: 55

Answers (3)

sinisake
sinisake

Reputation: 11328

 <input type="text" name="phonenum" id="phonenum" maxlength="10" pattern="^\d{3}-\d{6}$">

You don't need delimiters, that's all...tested in FF.

Upvotes: 0

ngleich
ngleich

Reputation: 286

You don't need to put the / / marks. Something like

<input type="text" name="phonenum" id="phonenum" maxlength="10" pattern="\d{3}[\-]\d{6}" required="required">

Should work

Upvotes: 1

Thibault Bach
Thibault Bach

Reputation: 556

Try this pattern:

pattern="[0-9]{3}-[0-9]{6}"

Upvotes: 0

Related Questions