Jquery移动登录表单

时间:2014-09-24 13:22:23

标签: jquery jquery-mobile login-script

我尝试使用Jquery mobile为移动应用程序设置登录表单。我找不到它为什么不起作用的错误。这是我的代码

    $(document).ready(function(){
         $('#loginForm').submit(function(){     
              useremail=$("#userEmail").val();
              password=$("#password").val();

            //alert(useremail + " password: " + password);

              $.ajax({
               type: "POST",
               url: "login.php",
               data: "email="+useremail+"&password="+password,
               success: function(data){ 
               if (data === 'true') {
                 $.mobile.pageContainer.pagecontainer("change", "#index", {transition: "slide"});
                }
                else {
                    $( "#error_popup" ).popup("open");
                }  
                }         
              });
            return false;
        });
    });

和login.php文件......

include("config.php");

session_start(); 
$email = $_POST["email"]; 
$password = md5($_POST["password"]); 
$query = "SELECT username FROM user WHERE email LIKE '$email' AND password LIKE '$password'";
$res = mysqli_query( $db_con, $query );
$rows = mysqli_num_rows($res);

echo $rows;

if($rows == 1) 
    { 
        echo true;
        $row = mysqli_fetch_row($res);
        $username = $row[0];
        $_SESSION["username"] = $username; 
    } 
else {
    echo false;
    } 

我希望有人可以帮助我。谢谢

2 个答案:

答案 0 :(得分:0)

尝试添加错误函数以捕获是否存在通信错误..

                error: function (xhr, ajaxOptions, thrownError) {
                showAlert(xhr.statusText, 1);
            }

还尝试在您的ajax请求中添加此内容:

async:false, cashe:false, dataType:" text",

所以,你的要求将是:

   $(document).ready(function(){
     $('#loginForm').submit(function(){     
          useremail=$("#userEmail").val();
          password=$("#password").val();

        //alert(useremail + " password: " + password);

          $.ajax({
           type: "POST",
           url: "login.php",
           data: "email="+useremail+"&password="+password,
            async: false,
            cache: false,
            dataType: "json",
           success: function(data){ 
           if (data === 'true') {
             $.mobile.pageContainer.pagecontainer("change", "#index", {transition: "slide"});
            }
            else {
                $( "#error_popup" ).popup("open");
            }  
            },
            error: function (xhr, ajaxOptions, thrownError) {
                showAlert(xhr.statusText, 1);
            }         
          });
        return false;
    });
});

答案 1 :(得分:0)

我认为您的问题是在ajax设置中,您正在构建数据,因为它是 GET 方法。 尝试改变这一部分。

 $(document).ready(function(){
     $('#loginForm').submit(function(){     
          useremail=$("#userEmail").val();
          password=$("#password").val();

        //alert(useremail + " password: " + password);

          $.ajax({
           type: "POST",
           url: "login.php",
           //data: "email="+useremail+"&password="+password,
           data: "{'email': '" + useremail+ "',"'password': '"+password+"'}",
           success: function(data){ 
           if (data === 'true') {
             $.mobile.pageContainer.pagecontainer("change", "#index", {transition: "slide"});
            }
            else {
                $( "#error_popup" ).popup("open");
            }  
            }         
          });
        return false;
    });
});

甚至更好

var DTO = { 'email': useremail, 'password': password};
 var send = JSON.stringify(DTO);

并在ajax中添加数据:发送