Pages Menu
TwitterRssFacebook
Categories Menu

Posted by on Nov 5, 2010 in Web | 34 comments

jQuery Email Validation without a Plugin

jQuery Email Validation

 

For updated code check out the fiddle on jsFiddle; Validate Email using jQuery

 

Validating Email using jQuery

More and more I am finding out that I use jQuery predominately for my projects. Now I keep a local repository of code snippets, but I as I have said in the past I am trying to move all my local code to the “cloud”. I am storing all my code on my website so that I will have even easier access than before and to get traffic to my site.

:)

jQuery Function to Validate Email

I really don’t like to use plugins, especially when my form only has one field that needs to be validated. I use this function and call it whenever I need to validate an email form field.

function validateEmail(email) {
var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
if( !emailReg.test( email ) ) {
return false;
} else {
return true;
}
}

Pretty basic here, but I always forget the Regex string. Now I can just copy the snippet from my site!

Looking for help

Does anyone have better code for jquery email validation? I am always trying to get my code to be more secure and more efficient and any help in greatly appreciated.

34 comments
Parol
Parol

Your code simply working. That's cool. :-)

Sudeep
Sudeep

but if i type ....@xyz.com, it accepts the email..

the Jim Gaudet
the Jim Gaudet

that is because periods are valid for email addresses, believe it or not.

Raziel
Raziel

Your function is cool, though using jQuery can make some things easier I prefer to make basic things the way I use to do them with pure Javascript.  I always use the electronic mail address regex from this web site:  http://www.regular-expressions.info/ It's really nice to see that there's still some people around who likes and knows how to use pure javascript, cause where I live, a lot of new programmers and kinda old too, think that jQuery is a new programming languange... xD

zarren_09
zarren_09

The $email means the ID of your element (textbox).

aryan
aryan

its not working 

the Jim Gaudet
the Jim Gaudet

Can you be more specific? This is just a function, so you have to add the input. Let me see your issue and I will try to help,

Ashwini
Ashwini

i m new to jquery...wht is $email..because wen i m putting this code i  m not getting anything

Slick Rick
Slick Rick

Thanks for this awesome little code snippet! Ashwini - it is the email variable that you call from your HTML. For instance, if you have a form with you would replace email (and $email) in the above code with either '.email' for class or '#email' for id.

Boruch
Boruch

$email is any parameter sent to the validateEmail() function 

Billynair
Billynair

 $email is a variable YOU set. most likely coming from an input field the user fills in

the Jim Gaudet
the Jim Gaudet

sorry I took so long to answer you. I just moved to a new place. I have created a jsFiddle for you to show you how this works. Check it out here; http://jsfiddle.net/thejimgaudet/kmvgw/ Basically, the $email should really be just email (do not use the dollar signs) and in order to test an email address you will need to pass it using an input box or some other means. In the jsFiddle I show you how to use an an HTML5 input email field and a submit button. I hope that helps, if so just give me a good vote up top :)

Nik Sumeiko
Nik Sumeiko

Your code could be even simplified: function validateEmail($email) { var emailReg = /^([w-.]+@([w-]+.)+[w-]{2,4})?$/; return emailReg.test( $email );} You don't need another IF statement to check if 'test' function returns falsy or trusty value.

Homeschool
Homeschool

I really did not want a jquery plugin to validate one email field, one time. This regex is just what I was looking for!  Thanks!!

the Jim Gaudet
the Jim Gaudet

No problem, this is the exact reason I put up this page.

Aaron Richards
Aaron Richards

just thought that i would mention that this doesnt require jQuery, it would work with anything that can pass the email to the function

%d bloggers like this: