Javascript email validation

This post will describe the javascript email validation.

First and foremost, all apologies for such a long delay in writing a new post. I was kind of tied up with some work. But from now on I’ll try my best to be regular :)

We will be using regular expression for email validation. And don’t you worry. I’ll see to it that by the time you finish reading this post, you would have got a fair idea about Regular Expressions.

Lets try to construct the regular expression that we will be using to check the email entered by the user.

Consider these two email id’s : example@example.com and exam_ple@ex.am.ple

Quick references:

. (dot) matches any single character. Ex. “h.t” will match “hut”, “hot” etc.

[ ] Brackets match a single character that is contained in the given expression. Ex. [a-d] will match ‘a’ or ‘b’ or ‘c’ or ‘d’. Similarly, [a-cx-z] will match ‘a’ or ‘b’ or ‘c’ or ‘x’ or ‘y’ or ‘z’.

^ Matches the starting position within the given string.

$ Matches the ending position of the given string.

* Matches the preceding element zero or more times.

+ Matches the preceding element one or more times.

{n,m} Matches the occurrence of the previous symbol not less than n and not more than m times.

\ Its the escape character. Ex. As shown above, .(dot) matches a single occurrence of any character. But what if we need to match an occurrence of (dot) itself. We write it as \.

Considering the email id’s shown above, we can list our requirements as follows:

1. Email Id needs to start with alphabets or numbers – regex will be ^([a-zA-Z0-9]) i.e. the email id should start with either an alphabet or a number.

2. It can contain any number of alphabets, numbers and a few special characters. RegEx will be ([a-zA-Z0-9\.\_\-])*

3. Then there should be the famous ‘@’ symbol which we simply write as @

4. Then again any number of alphabets or numbers or ‘-’ are allowed. RegEx is (([a-zA-Z0-9\-])+\.)+

5. Finally, the ending of the email ([a-zA-Z]{2,4})+$

Here’s the final regular expression for validating the email id’s :

^([a-zA-Z0-9])([a-zA-Z0-9\.\_\-])*@(([a-zA-Z0-9])+(\.))+([a-zA-Z]{2,4})+$

Now, lets see how to use it in the javascript. We make use of the search() function of javascript.

function emailValidation(){

var emailRegEx = /^([a-zA-Z0-9])([a-zA-Z0-9\._-])*@(([a-zA-Z0-9])+(\.))+([a-zA-Z]{2,4})+$/ ;

var testMail = “example@example.com”;

if(testMail.search(emailRegEx)==-1)

alert(“Invalid”);

}

Click Here to view the example.

UPDATE 1 : Please use the regular expression shown below instead of the one above. This fixes the bug which allowed consecutive special charaters i.e. previously example..example@example.com was displayed as valid. It has been fixed now. Please do test the script before you plan to use it. If you find some problems in it then do let me know. I’ll try and fix it.

var emailRegEx = /^([a-zA-Z0-9])(([a-zA-Z0-9])*([\._-])?([a-zA-Z0-9]))*@(([a-zA-Z0-9\-])+(\.))+([a-zA-Z]{2,4})+$/;

UPDATE 2: I’ve changed the regex a bit to allow email with ‘+’ in them. So, test+example@example.com would be a valid email.

var emailRegEx = /^([a-zA-Z0-9])(([a-zA-Z0-9])*([\._\+-])*([a-zA-Z0-9]))*@(([a-zA-Z0-9\-])+(\.))+([a-zA-Z]{2,4})+$/;

Tags: , , , , ,

20 comments

  1. You forgot the ? zero-or-one operator, so
    /a?maze/ matches both “amaze” and “maze”.

    You’re final expression can be a lot simpler. You can use \w, which matches any letter or number, and you don’t need so many parentheses:

    /^[\w][\w\._\-]*@[\w](?:[\w]+\.?)+[\w]\.[a-zA-Z]{2,4}$/

    The final + will allow too many things, too.

    Finally, since you have the ^ and $, you can just use RegEx::test, ie:

    emailRegEx.test(testMail)

    which returns true or false.

    I put up an example at http://jamessocol.com/projects/email.htm

  2. Whoops, I was wrong there, the proper RegExp is

    /^[\w][\w\._\-]*@(?:[\w]+\.?)*[\w]\.[a-zA-Z]{2,4}$/

    I forgot that there are a few one-letter domains.

  3. Thanks for this. Best JS email validation I’ve found so far. Very thorough.

  4. Thank you so much for the appreciation Scott. I’m so glad that it helped you. If you ever have any queries do leave me a comment. I’ll try my best to help ;o)

  5. Dude is this a valid email id ??

    example.@example.com

  6. So what about valid emails like “Abc\@def@example.com” and “customer/department=shipping@example.com”?

  7. @Oleg Are they valid!! As far as I know they dont seem valid. You can only have one ‘@’ symbol which is used to separate the domain from the address.

    I haven’t come across any site that allows me to use ‘=’ in my mail id. Let me know which site you are referring to. I’ll check it out and then make the appropriate changes.

    If you still want a regex to allow email id’s of the type specified by you then let me know. I’ll try to make changes to my reg ex and send it to you ;)

  8. Will it works,I doubt

  9. @Ravi

    I hope it does :) Well, it still is crude and has a few bugs but for simple email validations and to learn javascript regular expressions I guess the examples good enough.

  10. Sorry, but you should really implement Les Hazlewood’s Java solution in JavaScript.

    p+oruk@auamail! is a valid e-mail address.

  11. Yes, thats the one I was looking for!! and I found it. It is quite obviuous that we do need the validation at server level and JSP is the one who can do such tasks

    Many thanks for the post.

  12. I m not getting what i want….

  13. @ashwini you can ask your doubt, I’ll try to help you…

  14. If i put “p@y.com.com”..its showing valid input

  15. The code is very much help full only that it can accomodate many dots before and after ‘@’ character.

    Otherwise it has helped me alot, Thanks.

  16. Thanks Nischal Shetty, the commands are very useful and u have mentioned in detail.

    Thanks Again.

  17. @Sospeter you are allowed any number of dots but not consecutive dots… which I think is the right way to validate

    @Ashwini glad I could be of help :)

  18. This is very good. But how to modify this Regular expression for multiple addresses like

    name+someone@gmail.com, name2+someone2@gmail.com

  19. I want a js code to validate email address such that it should not accept the address below

    name@name.com

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>