Introduction to AJAX and check user availability using AJAX

AJAX stands asynchronous Javascript and XML. AJAX is techniques to load server content without loading page.There is alot of uses in web applications.AJAX is used to upload part of webpage without loading web page.Here we will see use of AJAX through "check user availability" program.

Famous application of AJAX is google Suggest.



Client Side Code
-----------------------------

<html>
    <head>
        <title>Three Column Div wrap Layout </title>

<script>
function availability()
{
var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
 
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
   
    document.getElementById("message").innerHTML=xmlhttp.responseText;
   
    }
  }
user = document.getElementById('user').value; 
xmlhttp.open("GET","welcome.php?user="+user,true);
xmlhttp.send();
}
</script>
</head>
<body>
    <div>
        <table>
            <tr>
                <td>user name</td>
                <td><input type="text" name="user" id="user" /></td>
                <td><input type="button" value="check availability" onclick="availability()"/>
            </tr>
            <tr>
                <td id="message"></td>
            </tr>
        </table>
    </div>
</body>
</html>


Server Side Code
----------------------------

<?php
    $user = $_GET['user'];
    $user = trim($user);
    if($user == "abc"){
        echo "Not Available";
    }
    else{
        echo "Available";
    }
?>


Server Side Code with MySQL
------------------------------------------

<?php
    $user = $_GET['user'];
    $user = trim($user);
    $user =  strtolower($user);
    $res = mysql_query("select * from users where user_name = '$user' ");
    $rows = mysql_num_rows($res); 
   if($rows){
        echo "Not Available";
    }
    else{
        echo "Available";
    }
?>

No comments:

Post a Comment