jquery to check email

**im pretty** · 31-07-2009

Hi,

I need some help to validate email field with JQuery.
Can someone please help me out?

Thanks

**worldpeace** · 31-07-2009

Plugins/Validation/Methods/email

email( )

Makes "field" required and an email address.

Code:

$("#myform").validate({
  rules: {
    field: {
      required: true,
      email: true
    }
  }
});

**Xeusion** · 31-07-2009

jQuery to validate Email Address

A program that validate the email address from server and displays on the user browser.

Create php file to that prints the current server data. Here is the code of PHP script (emailValidation.php).

Code:

<?

$email = $_GET['email'];


function isValidEmail($email){
return eregi("^[_a-z0-9-]+(\.[_a-z0-9-]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,3})$", $email);
}

if($email=="")
{
$errormsg="error1";
}
if(!isValidEmail($email) && $email!="")
{
$errormsg="error2";
}


echo $errormsg;
?>

Write HTML page to call the emailValidation.php. Create a new file (emailvalidation.html) and add the following code into it:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" 
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<style>
.error{
color:red;
}
</style>
    <title>E-Mail Validation</title>
    <script type="text/javascript" src="jquery-1.2.6.js"></script>
        <script type="text/javascript">  
function  emailValidate()
{

  
  email = document.getElementById("email").value;
   

	$.ajax({
	url : "emailvalidation.php?email="+email,
	success : function (data) {
	
	   if(data=="error1")
		  {
		     document.getElementById("erroremail").innerHTML=
                     "Please enter email.";

		  }
		  else if(data=="error2")
		  {
		     document.getElementById("erroremail").innerHTML=
                     "Please enter valid email.";

		  }
	}
	});

	
}
 </script>  
</head>
<form name="emailvalidate" action="" method="post" >


    <div><input type="hidden" name="query" value="" /></div>
    <table>
	<tr><td colspan=2>&nbsp;<div id="errormsg"></div></td></tr>
   
	<tr>
        <th align="left"><label for="email">Email</label></th>
        <td><input type="text" id="email" name="email" size="20" />
	
		</td>
       	<td id="erroremail" class="error"></td>

    </tr>
    <tr>
        <td></td>
        <td><input type="button" name="Submit" value="Submit" 
             onClick="emailValidate();"/></td>

    </tr>
    </table>
    

</form>

</html>