javascript - PHP and AJAX login form -

hello know subject has been proposed before, no 1 has done ajax manipulation standard did. i'm newbie ajax , jquery

the problem have here i'm not sure js function "ajaxpostcallmanip()" reaches "login.php"!!

i've made couple of alert()s nothing appears...please help

html code

    <link rel="stylesheet" type="text/css" href="jquery-files/jquery.mobile-1.3.1.css"/>     <script type="text/javascript" src="jquery-files/jquery-2.0.2.js"></script>     <script type="text/javascript" src="jquery-files/jquery.mobile-1.3.1.js"></script>     <script type="text/javascript" src="js/ajax.js"></script>  <div data-role="page" id="logindialog">     <header data-role="header">         <h3 style="margin-left: auto; margin-right: auto;">login or <a href="#regpage"                   data-transition="flip">register</a></h3>     </header>     <div data-role="content">         <form method="post" action="" onsubmit="check_login(); return false;">              <fieldset data-role="contolgroup">                                               <div data-role="fieldcontain">                                            <label for="login_username">username</label>                        <input type="text" name="login_username" id="login_username"                                placeholder="username" />                         <label for="login_pwd">password</label>                        <input type="password" name="login_pwd" id="login_pwd"                                placeholder="password" />                         <div style="margin: auto; text-align: center;">                            <label for="login_submit" class="ui-hidden-accessible">                                                    submit</label>                            <button onclick="this.form.submit()" value="submit"                                     data-inline="true"></button>                             <span class="error" id="login_err" name="login_err"                                   style="display: none; font-size: 12px;                                   text-align: center;">status</span>                        </div>                                   </div>              </fieldset>         </form>     </div> </div> 

js code

     // ajax call handler using method="post"     function ajaxpostcallmanip( str, url, todofunc )     {            var xmlhttp;                // request variable         if( window.xmlhttprequest )         // modern browsers         xmlhttp = new xmlhttprequest;         else                    // old browsers         xmlhttp = new activexobject("microsoft.xmlhttp");          xmlhttp.onreadystatechange=todofunc;         xmlhttp.open("post", url, true);         xmlhttp.send(str);     }      function check_login()     {         // construct post variables [username, password]         var poststr = "username=" + $('#login_username').val() + "&"              + "password=" + $('#login_pwd').val();          // call general purpose ajax handler function         ajaxpostcallmanip(poststr, "login.php", function()           // todofunc performed when server response ready         {         if( xmlhttp.readystate == 4 && xmlhttp.status == 200 )         {                alert(xmlhttp.responsetext);                     switch(xmlhttp.responsetext)             {                 case "1":                 $('#login_err').css({'color':'green','display':'block'})                                        .html('successful login');                                    break;              case "2":                     $('#login_err').css({'color':'red','display':'block'})                                        .html('incorrect username/password')                 break;              case "3":                 $('#login_err').css({'color':'red','display':'block'})                                        .html('please fill in fields')                 break;             }         }         });     } 

php code

<?php     include('dbmanip.php');      echo '<script> alert("inside login.php"); </script>';      $username = $_post['username'];     $password = $_post['password'];      // check post variables arrived safely     echo "<script> alert('username = ' + $username); </script>";           if(!empty($username) && !empty($password))     {         // fetch data database         $query = "             select username,password             users             username = '$username' , password = '$password';         ";            // execute query         $res = mysql_query($query);          // if there match credentials entered database         if(mysql_num_rows($res) == 1)         {             // fetch information , double check credentials             while($row = mysql_fetch_assoc($res))             {                 $db_username = $row['username'];                 $db_password = $row['password'];             }              // compare results user input             if( $username == $db_username && $password == $db_password)             {                 // credentials correct - response = 1                 echo '1';             }             else              {                 // credentials incorrect - response = 2                 echo '2';             }         }         else         {             // there no match in database             // credentials incorrect - response = 2             echo '2';         }     }        else      {         // if 1 or both fields empty - response = 3         echo '3';     } ?> 

first, need rewrite submit button:

<button type="submit" value="submit"data-inline="true"></button>  

second, move variable function make global:

    var xmlhttp;      // request variable      function ajaxpostcallmanip( str, url, todofunc )     {            if( window.xmlhttprequest )         // modern browsers         xmlhttp = new xmlhttprequest;         else                    // old browsers         xmlhttp = new activexobject("microsoft.xmlhttp");          xmlhttp.onreadystatechange=todofunc;         xmlhttp.open("post", url, true);         xmlhttp.send(str);     }