Username Availability Check with Fast, Small and Simple jQuery Code

Code Sport 14 Feb , 2014  


Hello guys, welcome to a new code recipe on codesupport, Today Im going to show you a very simple and short way of the useravailability check. Number of times we let user know that username is already exist after he submit a complete form, That seems very inconvenient to user to fill the whole form again and again with his/her favorite username… and this is also very important for us to keep username very differ from each other..  So lets see how we can make it very simple…



Step – 1 : Make a database connection –

$con = mysql_connect(“localhost”,”root”,”");
mysql_select_db(‘projects’, $con) or die(“Could not connect to Server”);

Step – 2 : Configure ajax file check.php –

$query = mysql_query(select ID from username_availability where username = ‘”.$_POST['username'].”‘);
$res = mysql_query($query);
echo “0″;
echo “1″;


Step – 3 : Set jQuery function in index file-

<script src="jquery-1.10.2.min.js" type="text/javascript"></script>
var username = $("#username").val();
if(username.length >= 3){
$("#status").html('<img src="loading.gif">Checking Availability...');
var postdata = {'username' : username}
if(data == '1'){
$("#status").html('<img src="good.jpg"><span class="green">URL Available - <b>'+username+'</b></span>');
$("#status").html('<span class="red">Username '+username+' Already Exist.</span>');
$("#status").html('<span class="red">Username must be minimum 3 characters</span>');
<div id="usr">User name: <input type="text" id="username" name="username" autoComplete="off"/></div>
<div id="status"></div>


You need to change the database details in the above code.. and insert some usernames in the table.. Enjoy the recipe its very short code to execute and understand..  Thanks for reading… If you like this recipe do not forget to subscribe and join our social media pages for getting more updates..


, ,