CODEWITHSUNDEEP
regexhtml
ChrisGeo
ChrisGeo

Reputation: 3907

HTML5 Regex Pattern Validation

The validation I need is the following A-Z, a-z, 0-9, no trailing/leading whitespace, -._ only once non-trailing/leading

Till now I have the following:

<input type="text" pattern="^\S[a-zA-Z0-9]*\S$">

This takes care of the leading trailing whitespace and A-Z,a-z,0-9, but it needs minimum 2 characters

Then I thought of something like this for the symbols -._

<input type="text" pattern="^\S[a-zA-Z0-9]*[\-_+]{,1}\S$">

But no luck there. Any ideas?

Upvotes: 0

Views: 460

Answers (1)

nhahtdh
nhahtdh

Reputation: 56809

Since pattern attribute uses the same syntax as JavaScript, you can use the following regex:

<input type="text" pattern="^(?=..)[a-zA-Z0-9]*([_.-][a-zA-Z0-9]*)?$">

You can test with the snippet above by typing something in, then change focus from the input.

The input can only contain a-zA-Z0-9 and at most once of _.-. The look-ahead in front (?=..) checks that there are at least 2 characters.

Upvotes: 3

Related Questions