Email Validation... advocating the use of +, and how embarrassed would you be to have written this?
- by Langdon
I take full advantage of GMail's wildcard feature ([email protected]). Unfortunately it seems that most developers don't understand that + is valid in an email address. This makes trying to unsubscribe a real chore sometimes.
Take TicketMaster for example... immediately you notice that they didn't even bother escaping the email address, so the text field defaults to "user [email protected]". Not a problem, we can just add the + manually. Once Submit is clicked, you'll notice the validation stops you right in your tracks. What now?
Most users would have to further contact TicketMaster and attempt to explain the situation. I opened up FireBug to investigate. That's when I noticed this whopping 74 line email validation function with so much redundancy it's ridiculous. My favorite check is on line 20, informing the user that his/her email cannot have more than one @. Unreal. My second favorite part is the TWO regular expressions used!
Imagine... someone was paid money for this... and by the looks of it, they were paid by the line count.
//Validates the email
function validateOptoutEmail(object) {
var emailStr = object.value;
if(emailStr == '' || emailStr == null) {
alert('Email can not be empty. Please provide email');
object.value = '';
object.focus();
return false;
} else if(Trim(emailStr).length == 0) {
alert('Email can not be empty. Please provide email');
object.value = '';
object.focus();
return false;
} else {
var atcount=0;
for(var i=0;i<emailStr.length;i++) {
if(emailStr.charAt(i)=='@') atcount++;
}
if(atcount>1) {
alert('Invalid email. Email cannot have more than one @');
object.value = '';
object.focus();
return false;
}
if(emailStr.indexOf('.') == -1) {
alert('Invalid email. Email must have one dot');
object.value = '';
object.focus();
return false;
}
if(emailStr.indexOf('..')!= -1) {
alert('Invalid email. Email cannot have consecutive dots');
object.value = '';
object.focus();
return false;
}
var dotpos=0;
for(var i=dotpos;i< emailStr.length;i++) {
var ichar=emailStr.charAt(i);
if(ichar=='.') dotpos=i;
}
for(var i=dotpos+1;i< emailStr.length;i++) {
var ichar=emailStr.charAt(i);
if((!isNaN(ichar)) || (ichar == '_')) {
alert('Invalid email. Email cannot have numbers or _ after dot');
object.value = '';
object.focus();
return false;
}
}
var pattern2=/^([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,4})+$/;
var pattern1=/^[0-9a-zA-Z\-\_.]+@\w+([\.-]?\w+)*(\.\w{2,4})+$/;
if (pattern1.test(emailStr)) {
if(pattern2.test(emailStr)) {
return true;
} else {
alert('Invalid email');
object.value = '';
object.focus();
}
return true;
} else {
alert('Invalid email');
object.value = '';
object.focus();
return false;
}
alert('Invalid email');
object.value = '';
object.focus();
return false;
}
}
I eventually just put a break point in FireBug and changed the value of the email address passed into the validation function. From there everything worked fine...
All that said, how can we get the word out there that + is valid in an email address? Too often, I'm unable to use the email address that I want to use for certain web sites because developers simply aren't aware of what constitutes a valid email address.
