donglian7879
donglian7879
2015-10-21 17:49
浏览 12

用ajax问题登录

I am trying to create on-page login.

without ajax it works very well. Here is my login.php;

if($_POST)
{
    $username =$_POST["username"];
    $password =$_POST["password"];
    $query  = $handler->query("SELECT * FROM members WHERE username='$username' && password='$password'",PDO::FETCH_ASSOC);
    if ( $say = $query -> rowCount() ){
        if( $say > 0 ){
            session_start();
            $_SESSION['session']=true;
            $_SESSION['username']=$username;
            $_SESSION['password']=$password;

            echo "ok";

        }else{
            echo "Couldn't login.";
        }
    }else{
        echo "Wrong username or password.";
    }
}

Anyway, here is my java script code;

            $(function(){
             $("#loginbutton").click(function(){
                var username = $("#username").val();
                var password = $("#password").val();
                if(username != "" && password != ""){
                    $.ajax("login.php",{
                        type : "POST",
                        data : "username="+username+"&password="+password,
                        success : function(data){
                            if(data == "ok"){
                                                    $("#message").html(data);
                            }else{
                                $("#fail").fadeIn();
                            }
                        }
                    });
                }
             });
            });

Even though I put correct login information (when I get "ok" response from login.php, it always outputs $("#fail").fadeIn(); . instead of $("#message").html(data); I couldn't figure out where I am mistaken.

and here is login form:

    <div id="login">    

       <form action="" onsubmit="return false;" method="post">

            <input type="text" class="form-control" id="username" name="username" placeholder="Username" autocomplete="off"><br>

            <input type="password" class="form-control" id="password" name="password" placeholder="Password" autocomplete="off"><br> 

            <input class="btn btn-success" type="submit" id="loginbutton" value="Login">

       </form>

            <div id="message">  </div>
            <div id="fail" style="display: none;">failed.</div> 

    </div>
  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

3条回答 默认 最新

  • dqspy04266
    dqspy04266 2015-10-21 17:52
    已采纳

    You are using type as post, but sending parameters as get.Change your ajax like this,

    $.ajax("login.php",{
        type : "POST",
        data : {username:username,password:password},// only this line is changed.
        success : function(data){
            if(data == "ok"){
                $("#message").html(data);
           }else{
               $("#fail").fadeIn();
        }
    }
    });
    
    点赞 评论
  • douyan8961
    douyan8961 2015-10-21 17:58

    Here is a quick example of using post with JQuery AJAX.

      $(document).ready(function(){
      $.post("login.php", {username:username, password:password}, function(data){
     if(data == 'ok'){
         $("#message").html(data);
     }else{
           alert(data);//alert the data you receive. It alerts you if there is any error in php file.
           $("#fail").fadeIn();
     }
    });
    });
    

    Hope that was helpful!

    点赞 评论
  • doujiejujixi27244
    doujiejujixi27244 2015-10-21 18:09

    Firstly, debug your code like this: 1) On button click you will put alert function inside javascript code. if it is working then move second step.

    2) use alert function to print username and password if it comes inside your javascript code and correct as you put into input fields then move third step.

    3) use serialize method in javascript.

    I hope its help you to get your solution.

    点赞 评论

相关推荐