Jquery ajax database username checker |
Lets follow these core coding of jquery ajax which helps you to check the availability of username or any other data.
First of all you need different 3 codes:
- Database table
- Simple HTML Form with Jquery Ajax method
- PHP coding "check_username.php"
Database Table
Create a table name users in database name test using like following codes:
CREATE TABLE users(
id int(11) not null auto_increment
username varchar(255) UNIQUE KEY,
password varchar(255),
PRIMARY KEY (id),
);
Simple HTML Form
<!doctype html>
<html>
<head>
<script src="<ADD JQUERY LIBRARY URL HERE>"></script>
ADD BELOW SCRIPT HERE OR ADD THE URL
</head>
<body>
<form method="post" name="form" action="check_username.php">
username<input type="text" name="username" id="username"/><br/>
<p id="res"></p>password<input type="password" name="password" id="password" />
<input type="submit" value="submit" name="submit" name="submit"/>
</form>
</body>
</html>
JQUERY AJAX SCRIPT
$(document).ready(function(){
$('#username').keyup(function(){
var uname = $(this).val();
if(uname.length>5)
{
$(#res).html("Processing...");
$.ajax({
type:'post',
url:"check_username.php",
dataType:'text' ,
data:{username:uname}, //key value pairing
success:function(value){
$('#res').html(value);
}
});
}
else{
$('#res').html('<div style="color:red">Needs more than 5 characters</div>');
}
});
});
check_username.php PHP file
//create database connection first
$dbConn = new mysqli("localhost","root","password","test");
//check whether the connection is ready or not
if($dbConn->connect_error)
{
die("Not connected with database, try again");
}
$username = $_POST['username'];
$sqlQuery = "SELECT USERNAME FROM users WHERE username = '$username' ";
$res = $dbConn->query($sqlQuery)
if($res->num_rows>0)
{
echo "Username Already Taken";
}
else{
echo "Username Available. Register Now";
}
I hope, the above code will help you to understand basic about .ajax() method of jquery. This is very much easy way to check username availability in database using jquery ajax method and php.
If you have any difficulties to understand the above code, feel free to ask me. I will do my best to help you. Keep coding, Thank you.
Post a Comment