CODEWITHSUNDEEP
htmlhtml-input
Vinod Jayachandran
Vinod Jayachandran

Reputation: 3898

HTML5 input - pattern with required="true" attribute still allows form submission

I have text box as below

<input type="text" name="country_code" pattern="[A-Za-z0-9|]{1,50}" title="Three letter country code" required="true">

When I submit the form without entering any value in the text box, empty string "" gets submitted. I was hoping required="true" to catch it and throw an error. I think the combination of required and pattern attribute is causing it behave wrong.

Any thoughts

Upvotes: 2

Views: 224

Answers (3)

alawy
alawy

Reputation: 1

just add "/" in end of required

<input type="text" name="country_code" pattern="[A-Za-z0-9|]{1,50}" title="Three letter country code" required />

Upvotes: 0

Kilian Stinson
Kilian Stinson

Reputation: 2394

Your syntax is wrong. Only required is required.

<input type="text" name="country_code" pattern="[A-Za-z0-9|]{1,50}" title="Three letter country code" required>

It's actually required="required" but you can ommit the second one and use the shorthand instead.

Upvotes: 2

Mihai Alexandru-Ionut
Mihai Alexandru-Ionut

Reputation: 48367

Please use required="required" insteed required="true"

<input type="text" name="country_code" pattern="[A-Za-z0-9|]{1,50}" title="Three letter country code" required="required">

Upvotes: 0

Related Questions