Does the Pattern attribute on an input element allow null values?

I ask the user to give me an alias that contains at least 3 characters and no more than 30 characters and contains only 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 am facing is that empty forms are accepted.
As expected, lines that are 1, 2, or 31+ long, or contain punctuation do not pass. But if they just don’t put anything in the box, that's accepted.

How can i fix this?

+4
source share
1 answer

Add attribute required.

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

Remember that you still need to perform server side validation.

+6
source

All Articles