JQuery Validation Email Regex not working

Question

I am trying to build a validation system in JQuery without using any plugins

My JQuery code is as such, I have a validation function for each input, e.g.:

function isEmail(email) {
  var regex = /^([a-zA-Z0-9_\.\-\+])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
  alert("email is "+regex.test(email));
  return regex.test(email);
}

You will notice I have an alert in this one, because the email is not validating properly despite the regex being borrowed from a highly-reputed answer -> Email validation using jQuery

I tested it with several valid emails to no avail. Valid emails taken from here -> http://en.wikipedia.org/wiki/Email_address#Valid_email_addresses. I changed the regex to just /\S+/ and everything else worked properly so I know that the problem lies within the regex.

Anyways, why does this regex not evaluate to true? My understanding is:

/^([a-zA-Z0-9_\.\-\+])+

Begins with any character a-z, A-Z, 0-9, ., -, or +. One or more times

\@

Followed by the "@" symbol

(([a-zA-Z0-9\-])+\.)+

followed by one or more of one or more characters a-z,A-Z,0-9, or -, then a period "."

([a-zA-Z0-9]{2,4})+$

Ending with one or more of two, three, or four characters a-z,A-Z,0-9

EDIT

I have some news, so there is some strange behaviour going on here. Look at this jsfiddle which was copied and pasted from my code -> http://jsfiddle.net/hxcD3/. The email evaluates to true. But if you visit the website I am working on -> danmacmill.host22.com, and type the same thing into the contact email input, it displays as false.

You will also notice that I logged the email variable passed to JQuery in the console so you can see the exact string. Why it is not validating properly is my question. For reference, here is my validation checker code:

function check(isValid, name, message) {
    if (! isValid(name) ) {
        if (! $('#div-'+name).hasClass("warned") ) {
            $('#div-'+name).prepend('<div class="bubble-wrapper"><div class="bubble"><p>'+message+'</p></div></div>');
            var div = $('#div-'+name).position();
            $('#info p:first-child').text("top: "+div.top);
            $('#info p:nth-child(2)').text("left: "+div.left);
            $('#div-'+name+' .bubble-wrapper').css({
                top: div.top - 35 + "px"
            });
            $('#div-'+name).addClass("warned");
        }
        return false;
    }
    else
        return true;
}

Did you consider users with emails ending in dot museum? http://about.museum/ — faffaffaff, Aug 09 '13 at 22:39
Also see http://stackoverflow.com/questions/201323/using-a-regular-expression-to-validate-an-email-address — Raekye, Aug 09 '13 at 22:40
@faffaffaff Like I said, I just borrowed the code, and to be honest no I never would have considered it had you not pointed this out — Bob, Aug 09 '13 at 22:41
@BrainStone haha if so sorry I didn't look at it, just meant to warn it wouldn't be simple (with the "sophisticated grammatical patterns in Perl, PCRE, and PHP" it's already so complicated) — Raekye, Aug 09 '13 at 22:44
I have some strange behaviour going on now that I look at things more closely, take a look at this jsfiddle which is copy and pasted from my script: — Bob, Aug 09 '13 at 22:46
http://en.wikipedia.org/wiki/Email_address#Valid_email_addresses — Bob, Aug 09 '13 at 22:50
I just found this one: ```(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])``` Credits go to: http://www.regular-expressions.info/email.html (This is the standard and should match at least 99.9999% of valid adresses!) — BrainStone, Aug 09 '13 at 22:55

Nabil Kadimi · Accepted Answer · 2013-08-09T22:56:25.877

1

The regex you mentioned --which is well known by the way, will match 99% of emails.

The only reason why I believe it's not working for you is that you are feeding the function emails with surrounding space or spacing, you must trim emails before testing them.

-- Edit --

Your script (myscript.js:170) has an error:

    if (! check(isEmail, "email", "Invalid email.") ) {

Remove quotes around email variable

    if (! check(isEmail, email, "Invalid email.") ) {

Same thing for lines: 159 and 171

edited Aug 09 '13 at 22:56

answered Aug 09 '13 at 22:51

Nabil Kadimi

10,078
2
51
58

Woops, thats an old script you were looking at. I found the problem though. I was passing the wrong argument. – Bob Aug 09 '13 at 23:06

JQuery Validation Email Regex not working

EDIT

1 Answers1