Check Email availability with php and jquery ajax

Check username availability with php and jquery ajax

Hi Guys this lesson we are going to learn Check Email availability with php and jquery ajax. if Email exist in database it will return return "Sorry Email Already Exist" Wihtout Reloading page..if such email not exist in database it will return "Congratulation email@domian.com Available".if Email not valid it will return "email is not valid"

=>Database Structure:

Database Name: => test

Table Name: => user

SQL For creating table user:

CREATE TABLE IF NOT EXISTS `user` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `username` varchar(150) NOT NULL,
  `email` varchar(150) NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=MyISAM AUTO_INCREMENT=5 DEFAULT CHARSET=latin1;

SQL Codes for Insert some rows

INSERT INTO `user` (`id`, `username`, `email`) VALUES
(2, 'ANJAN KUMAR', 'Anjankumardhali@gmail.com'),
(48, 'ANJAN', 'biswasshiuli608@gmail.com'),
(10, 'Supriya Gain', 'SupriyaStar@Yahoo.com'),
(42, 'Priyoshi Debi', 'priya6@gmail.coma'),
(47, 'ANJAN KUMAR', 'Anjankumardhali@gmail.com'),
(49, 'ANJAN', 'biswasshiuli608@gmail.com'),
(51, 'ANJANBD', 'biswasshiuli608@gmail.com');

Files:
1. index.html
2. check.php
3. jquery.js (use JQuery CDN)
4. script.js
5. style.css
now copy and use the below codes to Check email availability with php and jquery ajax

1. index.html

<html>
<head>
<title>Live Email Availlablity Check PHP AJAX</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> </script>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="script.js"></script>
<link rel="stylesheet" type="text/css" href="style.css"/>
</head>
<div id="content">
<h2>AJAX Email Availlablity Check</h2>
<form method="POST">
  <table>
    <tr>
 <td><span>Email:</span></td>
 <td><input type="text" id="email" autocomplete="off"/></td>
 </tr>
  </table>
</form>
<div id="success"></div>
</div>
</html>

2. check.php

<?php
    $conn=new mysqli('localhost','root','','test');
 if(!empty($_POST['email'])){
    $email=$_POST['email'];
 //Validating Email
 if(!filter_var($email,FILTER_VALIDATE_EMAIL)){
  echo "<font style=color:red>Your Email is Not Valid...</font> ";
 }else{
 $result=mysqli_query($conn,"SELECT*FROM user WHERE email='$email'");
 $count=$result->num_rows;
 if($count==0){
  echo "Congratulation <font style=color:green size=4>$email </font>Avialable...";
 }else{
   
 echo "Sorry <font style=color:red size=4>$email</font> Not Avialable..."; 
 }
 }
 }else{
  echo 'Please Enter Your Email';
 }
?>

3. jquery.js (use JQuery CDN)

4. script.js

$(document).ready(function(){
 $("#email").keyup(function(){
  var email=$("#email").val();

   $.ajax({
    url:"check.php",
    type:"POST",
    data:{email:email},
    success: function(data){
     $("#success").html(data);
    }
   });
   return false; 
 });
});

5. style.css

#content{
 width:400px;
 height:200px;
 background:white;
 margin:auto;
 box-shadow:4PX 2PX 4PX 4px;
}
span{
 font-size:20px;
 color:#595959;
 text-decoration:underline;
}
input[type=text]{
 width:250px;
 border-radius:5px;
 border:1px solid green;
 padding:10px;
}

use above codes to Check Email availability with php and jquery ajax.keep visiting this blog for more jquery ajax code...Please Leave your Comments..

Latest

Monday, February 5, 2018

Check Email availability with php and jquery ajax