Jquery - Ajax表单提交到MySQL查询

时间:2018-04-08 20:14:54

标签: jquery mysql ajax

我正在尝试编写一个脚本,显示用户输入密码的表单,提交表单并检查MySQL表中是否存在密码。

我遇到的问题是提交表单时查询运行并返回“成功”或“失败”,但返回的数据显示在查询所在的页面上。

我需要做的是执行表单提交,检查数据并根据“成功”加载另一页,或者“失败”显示警告。

我的Jquery:

<?php if($_GET['Error9'] == 1) { ?>
<script type="text/javascript">
$('#login_form').show();
function do_login(){
  var pass=$("#password").val();
  if(pass!="") {
    $("#loading_spinner").css({"display":"block"});
    $.ajax  ({
      type:'post',
      url:'do_login.php',
      data:{
    do_login:"do_login",
    password:pass
      },
    success:function(response) {
      if(response=="success") {
    window.location.href="clear_faults_submit.php";
      } else {
    $("#loading_spinner").css({"display":"none"});
    alert("Wrong Details");
      }
    }
  });
 } else {
   alert("Please Fill All The Details");
 }
return false;
}

</script>
<?php } ?>

查询的一部分:

if(isset($_POST['password']))
{
require_once('../../Connections/conn.php');

$pass=$_POST['password'];

mysql_select_db($database_iMaint, $iMaint);
$select_data = "SELECT * FROM AdminPIN WHERE  AdminPIN='$pass'";
$pass = mysql_query($select_data, $conn) or die(mysql_error());
$row_pass = mysql_fetch_assoc($pass);

 if($row_pass['AdminPIN'] = $_POST['password']) 
 {

  echo "success";
 }
 else
 {
  echo "fail";
 }
exit();
}

表格:

<div id = "login_form">
<form method="post" action="do_login.php" onsubmit="return do_login();">
<input type="text" name="password" id="password" placeholder="Enter PIN">
<br>
<input type="submit" name="login" value="DO LOGIN" id="login_button">
</form>
</div>

任何人都可以看到我出错的地方。 非常感谢你的时间。

1 个答案:

答案 0 :(得分:0)

您的form代码设置似乎会将表单发布两次。 action="do_login.php"onsubmit="return do_login();"

之间存在冲突

至少在您使用JavaScript处理表单提交时省略action,但请随时查看以下设置:

HTML:

<form id="login">
  <input type="text" name="password" id="password" placeholder="Enter PIN">
  <br>
  <input type="submit" value="Submit" />
</form>

jQuery的:

$(document).on("submit", "#login", function() {
  var pass = $("#password").val();
  if (pass != "") {
    //ajax call goes here
  } else {
    alert("Please Fill All The Details");
  }
  return false;
})