jQuery – Ajax Tutorials PHP

How to check Email and username availabilty live using jquery/ajax

In this I will explain about how to check email and username availabilty using AJAX(jquery)
View Demo 1. Create database with name demos. In demos data base create a table with name email_availabilty
Sample structure of table email_availabilty

CREATE TABLE IF NOT EXISTS `email_availabilty` (
`id` int(11) NOT NULL,
  `email` varchar(255) NOT NULL,
  `username` varchar(255) NOT NULL
) ENGINE=InnoDB AUTO_INCREMENT=5 DEFAULT CHARSET=latin1;

2. Create database connection file
Config.php

<?php
$con = mysqli_connect("localhost","root","","demos");
// Check connection
if (mysqli_connect_errno())
{
echo "Failed to connect to MySQL: " . mysqli_connect_error();
 }
?>

3. Now Create a HTML form
index.php

<?php
include_once("config.php");
?>
<table>
<tr>
<th width="24%"  height="46" scope="row">Email Id :</th>
<td width="71%" ><input type="email" name="email" id="emailid" onBlur="checkemailAvailability()" value="" class="form-control" required /></td>
</tr>
<tr>
<th width="24%"  scope="row"></th>
<td >   <span id="email-availability-status"></span> </td>
</tr>
<tr>
<th height="42" scope="row">User Name</th>
<td><input type="text" name="username" id="username" value="" onBlur="checkusernameAvailability()" class="form-control" required /></td>
</tr>
<tr>
<th width="24%"  scope="row"></th>
<td >   <span id="username-availability-status"></span> </td>
</tr>
</table>

4. Jquery/ajax script where you pass variable to check_availability.php page. put this in index.php inside head.

	<script>
function checkemailAvailability() {
$("#loaderIcon").show();
jQuery.ajax({
url: "check_availability.php",
data:'emailid='+$("#emailid").val(),
type: "POST",
success:function(data){
$("#email-availability-status").html(data);
$("#loaderIcon").hide();
},
error:function (){}
});
}
function checkusernameAvailability() {
$("#loaderIcon").show();
jQuery.ajax({
url: "check_availability.php",
data:'username='+$("#username").val(),
type: "POST",
success:function(data){
$("#username-availability-status").html(data);
$("#loaderIcon").hide();
},
error:function (){}
});
}
</script>

5.check_availability.php page in this page you will check yhe availablity of email or email

<?php
require_once("config.php");
//code check email
if(!empty($_POST["emailid"])) {
$result = mysqli_query($con,"SELECT count(*) FROM email_availabilty WHERE email='" . $_POST["emailid"] . "'");
$row = mysqli_fetch_row($result);
$email_count = $row[0];
if($email_count>0) echo "<span style='color:red'> Email Already Exit .</span>";
else echo "<span style='color:green'> Email Available.</span>";
}
// End code check email
//Code check user name
if(!empty($_POST["username"])) {
	$result1 = mysqli_query($con,"SELECT count(*) FROM email_availabilty WHERE username='" . $_POST["username"] . "'");
	$row1 = mysqli_fetch_row($result1);
	$user_count = $row1[0];
	if($user_count>0) echo "<span style='color:red'> Username already exit .</span>";
	else echo "<span style='color:green'> Username Available.</span>";
}
// End code check username
?>
View Demo  
Download Source Code(Email and username availabilty live using jquery/ajax)
Size: 28 KB
Version: V 2.0

Recommended Tutorials for you


Related posts

How to change Password in php

Anuj Kumar

Sorting Arrays in PHP

Anuj Kumar

Store Procedure In PHP

Anuj Kumar

PHP-Basic Development Concepts

Anuj Kumar

How to Concatenate two or more string in PHP

Anuj Kumar

Array in PHP

Anuj Kumar

Looping Statement In PHP

Anuj Kumar

PHP Constants

Anuj Kumar

Leave a Comment

* By using this form you agree with the storage and handling of your data by this website.

This site uses Akismet to reduce spam. Learn how your comment data is processed.