jQuery Username Availability check with MySQL

Hi friends,

You must have seen many sites with a feature where you enter a username and it checks whether it is available or not without refreshing that page. I have its secret to share it with you. It is also protected from SQL injections

Step 1 : Download jQuery

Step 2 : Prepare dbconfig.php page as

<?php

$mysql_hostname = “Host name“;
$mysql_user = “UserName“;
$mysql_password = “Password“;
$mysql_database = “Database Name“;
$prefix = “”;
$bd = mysql_connect($mysql_hostname, $mysql_user, $mysql_password) or die(“Could not connect database”);
mysql_select_db($mysql_database, $bd) or die(“Could not select database”);
?>

Step 3 : Prepare namechecker.php with code as

<script src=”js/jquery.js” type=”text/javascript”>/script>

<script type=”text/javascript”>
pic1 = new Image(16, 16);
pic1.src = “loader.gif”;

$(document).ready(function(){

$(“#username”).change(function() {

var usr = $(“#username”).val();

if(usr.length >= 3)
{
$(“#status”).html(‘<img align=”absmiddle” src=”loader.gif” /> Checking availability…’);

$.ajax({
type: “POST”,
url: “namechecker.php”,
data: “username=”+ usr,
success: function(msg){

$(“#status”).ajaxComplete(function(event, request, settings){

if(msg == ‘OK’)
{
$(“#username”).removeClass(‘object_error’); // if necessary
$(“#username”).addClass(“object_ok”);
$(this).html(‘ <img align=”absmiddle” src=”accepted.png” /> ‘);
}
else
{
$(“#username”).removeClass(‘object_ok’); // if necessary
$(“#username”).addClass(“object_error”);
$(this).html(msg);
}});}});}
else
{
$(“#status”).html(‘The username should have at least 3 characters.’);
$(“#username”).removeClass(‘object_ok’); // if necessary
$(“#username”).addClass(“object_error”);
}});});

//–>

</script>