Friday, February 25, 2011

Ajax Auth For Login

This is a code on how to use ajax as handler for login authentication like google login page. There are you see that when you done wrong with your username or password, Google won't reload the page till your username and password are correct.

HTML file:
<form action="some.php" method="post" onsubmit="return isAuth()">
<input type="text" name="username" id="username"/>
<input type="password" name="password" id="password"/>
<p id="msg"></p>
<input type="submit" value="Log In"/>

Javascript file:
function isAuth(){
   var username = document.getElementById('username').value;
   var password = document.getElementById('password').value;
   var msg = document.getElementById('msg');

   var ajax = new XMLHttpRequest();"POST", "auth/"+username+"/"+password, false);
   var response = eval(ajax.responseText);

   if(response == 1){
      return true;
   }else if(response == 0){
      msg.innerHTML = 'Access Denied."
                 +"Please recheck your username and password";
      return false;

PHP file:
 * check if the username and password match over what 
 * if YES
 * echo 1
 * if NO
 * echo 0


No comments:

Post a Comment