Fire html5 email validator on losing focus besides just on submission of forms

Question

I have an email input field where i check if the email is already present in my database using ajax on losing focus from that email input. I want to make sure the email entered is in the correct format before i make an ajax call. Can i do this with html5 built-in email validator or do i have to write my own validation function?

Edit:I am already using the html5 email validator but it validates the email only when the form is submitted.

Answer 1

In Firefox, it should check the email for validity as you're typing by default (native HTML5 behavior): http://jsfiddle.net/xs65r/

But to support all HTML5 browsers, you'll need to manually call checkValidity() onblur and/or onkeydown.

See this link for more detail: HTML5 Chrome checkValidity onBlur

As you said in your comment below, you have to use the function this.checkValidity() in an if clause in your onblur function before making the ajax call, and dispay any errors yourself, since in browsers other than Firefox the native validation message UI isn't triggered unless the form is submitted.