ajax将php表单提交到数据库,ajax部分没有;不起作用


ajax to submit php form to database, ajax part doesn't work

我对ajax很陌生,所以我学习了一个教程,但我无法让它发挥作用。我试着在这个论坛上搜索答案,但没有成功。。

HTML(有点从类和引导程序中剥离出来)

<form id="editUserForm" role="form">
  <input id="edit_employeenr" type="text" name="employeenr">
  <input id="edit_name" type="text" name="name">
  <select id="edit_membertype" name="membertype">
    <option value="1">Admin</option>
    <option value="2">Employee</option>
  </select>
  <input type="submit" value="Save">
</form>
<div id="editUserMsg">Successfully updated!</div>

JS

$(document).ready(function() {
  $("#editUserMsg").hide();
  $("#editUserForm").submit(function(event) {
    event.preventDefault();
    submitUserEdit();
  });
  function submitUserEdit(){
    var dataString = $("#editUserForm").serialize();
    $.ajax({
        type: "POST",
        url: "user_edit_process.php",
        data: dataString,
        success: function(text){
          if (text == "success"){
            userEditSuccess();
          }
        }
    });
  }
  function userEditSuccess(){
    $("#editUserMsg").show().delay(5000).fadeOut();
  }
});

PHP(user_edit_process.PHP)

<?php
  $employeenr = $_POST['employeenr'];
  $name = $_POST['name'];
  $membertype = $_POST['membertype'];
  $stmt = $link->prepare("UPDATE users SET employeenr = ?, name = ?, membertype = ?");
  $stmt->bind_param("isi", $employeenr, $name, $membertype);
  $stmt->execute();
  if ($stmt) {
    echo 'success';
  } else {
    echo 'fail';
  }
?>

如果我把$("#editUserMsg").show().dealy(5000).fadeOut();放在$.ajax的正上方,就会出现消息,所以这一定意味着ajax代码工作不正常。有什么建议吗?

编辑已解决。我忘记了包含定义变量$link的文件。

您的prepare语句或bind_parameter中似乎有问题。你应该总是检查错误,所以我建议你这样做来检查错误:

<?php
    $employeenr = $_POST['employeenr'];
    $name = $_POST['name'];
    $membertype = $_POST['membertype'];
    if (!($stmt = $mysqli->prepare("UPDATE users SET employeenr = ?, name = ?, membertype = ?"))) {
        echo "Prepare failed: (" . $mysqli->errno . ") " . $mysqli->error;
    }
    if (! $stmt->bind_param("isi", $employeenr, $name, $membertype)) {
        echo "Binding parameters failed: (" . $stmt->errno . ") " . $stmt->error;
    }
    if (!$stmt->execute()) {
        echo "Execute failed: (" . $stmt->errno . ") " . $stmt->error;
    }
?>

然后在你的JS中,把这个添加到你的成功方法中:

console.log(text);

检查您的Firefox控制台(Ctrl-Shift-Q),如果有错误,您会在"Network"->下找到它。单击列表->中的"user_edit_process.php",然后在"Preview"下的右侧窗口中找到它。

这就是user_edit_process.php中的所有代码吗?

$link变量是否正确初始化?

您可以尝试在PHP文件中注释部分代码,并编写如下内容来测试Ajax代码是否正常工作:

<?php
  $employeenr = $_POST['employeenr'];
  $name = $_POST['name'];
  $membertype = $_POST['membertype'];
  // $stmt = $link->prepare("UPDATE users SET employeenr = ?, name = ?, membertype = ?");
  // $stmt->bind_param("isi", $employeenr, $name, $membertype);
  // $stmt->execute();
  if ($employeenr) {
    echo 'success';
  } else {
    echo 'fail';
  }

然后,如果您在第一个employeenr表单输入中键入内容,它应该显示已成功更新。如果您将此输入留空并发送表单,则它不应该显示。