Why HTML5 pattern is not detecting wrong/correct email addresses?

Question

I have used this

       <input type="text" id="email" name="email" pattern="[a-z0-9._%+-]+[a-z0-9.-]+\.[a-z]{2,3}$" class="form-control" placeholder="Email" required>

So if email address is not in valid format then it should throw error.

it is to catch wrong email address format like name@jjjj or name or name@ or name@jj.cooooo etc

but it doesn't work i.e. it throws the message i.e. pattern must be matched even if the email is correct.

You could add it like `[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,3}` — The fourth bird, Mar 24 '19 at 10:12
error: "[" is not valid at the start of a code block. Only identifiers, keywords, comments, "(" and "{" are valid. – — Johnny Shallow, Mar 24 '19 at 10:14

handras · Answer 1 · 2019-03-24T10:31:12.150

0

Use <input type="email"> to get browser support for checking.

Answer to why "johnny@gmail" is accepted:

You can theoretically have an address without a "." in

See the original answer here

edited Mar 24 '19 at 10:31

answered Mar 24 '19 at 10:13

handras

.com is not valid email address, so it will fail the check. Or how do you mean it would not work? – handras Mar 24 '19 at 10:17
see i haven't mentioned the .com in it and still it worked – Johnny Shallow Mar 24 '19 at 10:18

1 Answers1