php & ajax Login Script

Html file For Ajax Login

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="ajex_login.js"></script>
<form name="login_form" method="post" action="javascript:login();" id="login_form">
    <table width="70%" border="0" align="center" cellpadding="2" cellspacing="2">
      <tr>
        <td colspan="2" class="star" align="center"><div id="login_response" class="star"></div></td>
      </tr>
      <tr>
        <td width="40%" align="right" class="label">User Name : </td>
        <td width="60%"><input type="text" name="UserName" class="input" id="UserName"/>
      </tr>
      <tr>
        <td align="right" class="label">Password : </td>
        <td><input type="password" name="Password" class="input"  id="Password"/>
        <!--a href="#" class="hintanchor" onMouseover="showhint('Enter the desired password.', this, event, '200px')">[?]</a-->
        <span id="password_warning" style="color:red" class="star"></span></td>
      </tr>
      <tr>
        <td align="right"> </td>
        <td>
        <input type="submit" name="Submit" value="Login" class="submit" />
        <input type="reset" name="Reset" value="Reset" class="submit"/></td>
      </tr>
    </table>
    <!--/div-->
    </form>  


Javascript file for Ajax login  ajex_login.js
// JavaScript Document
function createObject()
{
    var request_type;
    var browser = navigator.appName;
    if(browser == "Microsoft Internet Explorer")
    {
        request_type = new ActiveXObject("Microsoft.XMLHTTP");
    }
    else
    {
        request_type = new XMLHttpRequest();
    }
    return request_type;
}

var http = createObject();

var nocache = 0;
function login()
{
    // Optional: Show a waiting message in the layer with ID ajax_response
    //document.getElementById('login_response').innerHTML = "Loading..."
    // Required: verify that all fileds is not empty. Use encodeURI() to solve some issues about character encoding.
    var UserName = encodeURI(document.getElementById('UserName').value);
    var Password = encodeURI(document.getElementById('Password').value);
    // Set te random number to add to URL request
    nocache = Math.random();
    // Pass the login variables like URL variable
    http.open('get', 'login.php?UserName='+UserName+'&Password='+Password+'&nocache = '+nocache);
    http.onreadystatechange = loginReply;
    http.send(null);
}
function loginReply()
{
    if(http.readyState == 4)
    {
        var response = http.responseText;
        if(response == 0)
        {
            document.getElementById('login_response').innerHTML = 'Wrong UserName or Password! ';
        }
        else
        {
            window.location="homepage.php";
        }
    }
}


php file for ajax login login.php

<?php
    $UserName = $_GET['UserName'];
    $Password = $_GET['Password'];
    $var_msg = $_GET['var_msg'];
    if($UserName =="admin" && $Password="admin")
       echo '1';
    }
    else
    {
        echo '0';
    }
?>

No comments:

Post a Comment