CODEWITHSUNDEEP
regexhtmlvalidation
Tako M.
Tako M.

Reputation: 295

Pattern attribute on input element allows empty values?

I'm requesting the user give me a nickname that is at least 3 characters and at most 30 characters and only contains letters and numbers.

<form>
    Nick: <input type="text" name="nick" pattern="[A-Za-z0-9]{3,30}">
    <input type="submit" value="Join lobby">
</form>

The problem I'm having is that empty forms are accepted.
As expected, strings that have a length of 1, 2, or 31+, or contain punctuation, do not pass. But if they just don't put anything into the box, it is accepted.

How can I fix this?

Upvotes: 6

Views: 6078

Answers (1)

Explosion Pills
Explosion Pills

Reputation: 191749

Add the required attribute.

<input type="text" required name="nick" pattern="[A-Za-z0-9]{3,30}" required>

Remember that you still need to do validation on the server side.

Upvotes: 9

Related Questions