HTML5 form validation for email

Question

I am stuck with this issue to which I did not pay attention to before.

<label> Email Address </label>
<input type="email" id="emailAddress" required placeholder='Email Address' />
<button type="submit" class="button primary small">Submit</button>

In my JS file I am checking for its validation using checkValidity()

checkValidEmail: function(event){
  var emailAddress = $('#emailAddress');
  if(emailAddress[0].checkValidity()){
    console.log('Valid');
  } else{
    console.log('Not Valid');
  }
}


"keyup #emailAddress": "checkValidEmail" // KeyUp works as expected

Output:
  'a@b' // Valid

I do not understand this behavior. As per my knowledge @.com was the regex for input email.

Please note: I tried this on multiple sites with forms and it shows the same input. In the above case I am executing this on the chrome browser.

Thanks for taking time to reply!

Not all browsers support type email. *@.com* is not a regular expression. If it was, a great many email addresses would fail. — RobG, Oct 18 '15 at 22:53
Yes it is a similar question. But the answer in that fails the expression that Maksym has provided below. Which is a valid email address. If you guys want to still mark it as duplicate. Will be happy to do so! — suprita shankar, Oct 19 '15 at 01:12

score 0 · Answer 1 · answered Oct 18 '15 at 23:28

0

in HTML5 you can validate email like this

<form>
    <input type="email" placeholder="Enter your email">
    <input type="submit" value="Submit">
</form>

answered Oct 18 '15 at 23:28

Vandervidi

642
2
14
32

1

What it changes from what OP have? – Oct 18 '15 at 23:38

Maksym Kozlenko · Accepted Answer · 2015-10-19T02:16:59.190

If you want to use regular expression validation, read on

http://www.regular-expressions.info/email.html

Be aware that below is 100% valid and working email address :-) Use it often for testing incorrectly implemented email validation

xn--80a1acny@xn--80auew.xn--j1amh

Another option is to check if email address domain name is valid. Do do that you can query DNS server for MX record (this one points to SMTP server responsible for receiving incoming mail). You will need server side code to do that.

HTML5 form validation for email

2 Answers2