douzhou7124
2017-06-03 16:11
浏览 51

jQuery Ajax函数不起作用?

I'm developing a simple login form for my website. And to do that I thought to use ajax to connect with php to validate users. However to do that I cannot get output from ajax.

<script>
 function submitForLogin() 
 {  
    $.ajax({
            type: "POST",
            url: "php/login.php",
            data: { email: "example@abc.com",password:"123" }}).done(function(data){alert(data);});

 }

</script>

When user clicks on login button it calls submitForLogin() function.

Above part of the code I've placed in my login.html file. To validate whether this works or not I simply replaced data values of email and password with hard coded values.

Note : example@abc.com and 123 both email and password stored in Wamp server database.

This is the PHP file :

<?php
$userEmail=$_POST['email'];
$userPass=$_POST['password'];
$servername ="localhost";
    $username="root";
    $password="";
    $dbname="AS2014459";
    //To create a connection
    $con = mysqli_connect($servername,$username,$password,$dbname); //check connection
    if(!$con){
        die("Connection failed: ".mysqli_connect_error());
    }   
    $sql="SELECT Email,Password FROM USERTABLE WHERE Email='".$userEmail."'";
    $results=mysqli_query($con,$sql);
    if(mysqli_num_rows($results)>0)
    {
        echo "userExist";
    }
    else
    {
        echo "fakeUser";
    }
    mysqli_close($con);



?>

Whenever I run php file only (with $userEmail and $userPass having previous hard coded values) php prints userExist output. But using ajax I cannot get that in an alert box.

Is there something I missing? I'm running the website in wamp server too.

UPDATE

When I check console errors it shows;

enter image description here

And when I click on login.html line 112, it shows;

enter image description here

And ideas guys? Also, none of the solutions provided so far gave me successful answer for the question.

There was a jquery error and now it's fixed. But syntax error exists.

  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

4条回答 默认 最新

  • douzhang8840 2017-06-03 16:31
    已采纳

    Try this code working for me on my machine. Don't forgot to place Jquery File. PHP (ajax.php) :

    <html>
    <head>
        <script src="jquery.min.js"></script>
        <script>
            function submitForLogin() 
     {
            alert("23");
            var email = document.getElementById("txtUserName").value;
            var password = document.getElementById("txtPassword").value;
        $.ajax({
                type: "POST",
                url: "login1.php",
                data: { email: email,password:password },
                success : function(response){
                    alert(response);
                }
       });
    
     }
    
        </script>
    </head>
    <body>
        <input type="text" placeholder = "Enter user name" id="txtUserName"/>
        <input type="password" placeholder = "Enter password" id="txtPassword"/><br>
        <input type="button" onclick="submitForLogin();" value="Login"/>
    </body>
    </html>
    

    Server Side (login1.php) :

        <?php
    var_dump($_POST);
    ?>
    
    点赞 打赏 评论
  • dou12352 2017-06-03 16:16

    You need to include a function for when the request is successful, which includes the response.

    $.ajax({
        type: "POST",
        url: "php/login.php",
        data: { email: "example@abc.com",password:"123" },
        success:function(data){
            alert(data)
        };
    });
    
    点赞 打赏 评论
  • duanhuo7441 2017-06-03 16:21
    $.ajax({
        type: "POST",
        url: "php/login.php",
         data: { email: "example@abc.com",password:"123" },
        success: function (data) {
            alert(data);
    
        }
    });
    

    your data in AJAX call is in JSON format. in your php script you should use json decode as below

    $data = file_get_contents("php://input");
    $data = json_decode($data,true);
    $userEmail=$data['email'];
    $userPass=$data['password'];
    

    i hope this might help you. your login will work as u expect it

    点赞 打赏 评论
  • dsfdgdsfd23212 2017-06-03 16:35

    Change your php file like below :

    <?php
    $userEmail=$_POST['email'];
    $userPass=$_POST['password'];
    $servername ="localhost";
    $username="root";
    $password="";
    $dbname="AS2014459";
    //To create a connection
    
    header('Content-type: application/json');
    
    
    $con = mysqli_connect($servername,$username,$password,$dbname); //check connection
    if(!$con){
        die("Connection failed: ".mysqli_connect_error());
    }   
    $sql="SELECT Email,Password FROM USERTABLE WHERE Email='".$userEmail."'";
    $results=mysqli_query($con,$sql);
    if(mysqli_num_rows($results)>0)
    {
         $res = "userExist";
         $data = json_encode($res);
         echo $data;
         die();
    
    }
    else
    {
    
        $res = "fakeUser";
        $data = json_encode($res);
        echo $data;
        die();
    }
    mysqli_close($con);
    
    
    
    ?>
    

    And your script :

    $.ajax({
    type: "POST",
    url: "php/login.php",
    data: { email: "example@abc.com",password:"123" },
    success:function(data){
        alert(data);
    };
    });
    
    点赞 打赏 评论

相关推荐 更多相似问题