check username availability using ajax and javascript Live Username Availability Check using PHP and jQuery AJAX Example with full source code.
check username availability using ajax and javascript, PHP with MySQL
The CheckAvailability JavaScript function gets called when the Button is clicked.
Database Script for members Table
members.sql
CREATE TABLE IF NOT EXISTS `members` ( `memberId` int(8) NOT NULL AUTO_INCREMENT, `memberName` varchar(55) NOT NULL, `password` varchar(55) NOT NULL, `firstName` varchar(55) NOT NULL, `lastName` varchar(55) NOT NULL, PRIMARY KEY (`memberId`) ) INSERT INTO `members` (`memberId`, `memberName`, `password`, `firstName`, `lastName`) VALUES (24, 'Rakesh', '', 'Rakesh', 'Bhandeto'), (26, 'milan', '', 'davada', 'demoliya'), (27, 'krish', '', 'krishna', 'kkv'), (28, 'mayur', '', 'mayur', 'dhameliya');
Database connection
DatabaseConfig.php
<?php class DatabaseConfig { private $host = "localhost"; private $user = "root"; private $password = "Pakk#$%87956"; private $database = "pakainfo_v1"; private static $link; function __construct() { $this->link = $this->connectDB(); if(!empty($this->link)) { $this->selectDB(); } } function connectDB() { $link = mysqli_connect($this->host,$this->user,$this->password,$this->database); return $link; } function selectDB() { mysqli_select_db($this->link, $this->database); } function numRows($query) { $result = mysqli_query($this->link, $query); $rowcount = mysqli_num_rows($result); return $rowcount; } } ?>
Don’t miss : PHP JQuery AJAX Live Check Email Availability
Check Username Availability Form Interface
jQuery AJAX Handler to Request User Availability
index.php
<style> body{width:50%;} #frmCheckmembername {border-top:#F0F0F0 2px solid;background:#FAF8F8;padding:10px;} .demoInputBox{padding:7px; border:#F0F0F0 1px solid; border-radius:4px;} .check-available{color:#2FC332;} .check-not-available{color:#D60202;} </style> <script src="https://code.jquery.com/jquery-2.1.1.min.js" type="text/javascript"></script> <script> function checkAvailability() { $("#loaderIcon").show(); jQuery.ajax({ url: "check_availability.php", data:'membername='+$("#membername").val(), type: "POST", success:function(data){ $("#member-availability-check").html(data); $("#loaderIcon").hide(); }, error:function (){} }); } </script> <div id="frmCheckmembername"> <label>Check membername:</label> <input name="membername" type="text" id="membername" class="demoInputBox" onBlur="checkAvailability()"><span id="member-availability-check"></span> </div> <p><img src="LoaderIcon.gif" id="loaderIcon" style="display:none" /></p>
Match Username against Database using PHP
check_availability.php
<?php require_once("DatabaseConfig.php"); $db_handle = new DatabaseConfig(); if(!empty($_POST["membername"])) { $query = "SELECT * FROM members WHERE memberName='" . $_POST["membername"] . "'"; $member_count = $db_handle->numRows($query); if($member_count>0) { echo "<span class='check-not-available'> membername Not Available.</span>"; }else{ echo "<span class='check-available'> membername Available.</span>"; } } ?>
I hope you get an idea about check username availability using ajax and javascript.
I would like to have feedback on my infinityknow.com.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.