AJAX序列化数据为空答案

【问题标题】：AJAX serialized data emptyAJAX序列化数据为空
【发布时间】：2018-04-30 00:10:46
【问题描述】：

我正在尝试通过 AJAX 发布表单数据。

当我删除 AJAX 函数并执行标准表单 POST 方法时，数据被插入到数据库中。当我console.log 提交时表单的序列化数据显示正常。

在触发 AJAX 函数时，数据似乎消失了。该函数成功触发，但没有插入数据，并且 formdata 变量似乎为空。任何人都可以对此有所了解吗？

这是目前的代码 -

jQuery/AJAX -

$('#calendar-form').submit(function() {
  var formdata = $(this).serialize();
  console.log(formdata);
  $.ajax({
    url: "insert.php",
    type: "POST",
    data: formdata,
    success: function() {
      alert('success')
    },
    error: function() {
      alert('ERROR');
    }
  });

  return false;
});

HTML

<form id="calendar-form" action="" method="" accept-charset="utf-8">
    <input type="text" name="name" id="name">
    <input type="text" name="email" id="email">
    <input type="hidden" name="site" id="site" value="<? echo $_SERVER['HTTP_HOST'] ?>">
    <input class="submit" type="submit" name="submit" value="Submit">
</form>

PHP

try {
    $bd = new PDO("mysql:host=localhost;dbname=;charset=utf8", "", "");
        //  $bd->setAttribute(PDO::ATT_ERRMODE, PDO::ERRMODE_EXCEPTION);
    } catch (PDOException $e) {
        echo 'Theres been an error while attempting to connect to the database';
    }

    if(isset($_POST['submit'])){
        $name = $_POST['name'];
        $email = $_POST['email'];
        $site = $_POST['site'];

        $sql = "INSERT INTO `users`(`name`, `email`, `site`) VALUES ('$name', '$email', '$site')";

        try {
            $query = $bd->prepare($sql);
            $query->bindValue(':name', $name, PDO::PARAM_STR);
            $query->bindValue(':email', $email, PDO::PARAM_STR);
            $query->bindValue(':site', $site, PDO::PARAM_STR);

            if($query->execute()){
                echo "Success";
            }else{
                echo "Failure";
            }
        } catch (Exception $e) {
            echo $e->getMessage();
        }
    }

注意：我已经删除了这篇文章的数据库详细信息，但它们在代码中。

控制台

name=Benji&email=email%40email.com&site=localhost%3A8888 - scripts.min.js:9:117

网络

【问题讨论】：

你没有正确使用准备好的语句..使用占位符作为值..不要把帖子数据扔进去
您能否查看开发人员工具的“网络”选项卡来分析该请求？
什么是 print_r($_POST);返回？
console.log(formdata); => console.debug(formdata);控制台的输出是什么？
@OfirBaruch Network 看起来不错，使用 insert.php 的 post 方法的状态为 200。所有脚本和 css 也被包括在内。

标签： javascript php jquery ajax

【解决方案1】：

这是因为jQuery的.serialize()does not include the submit button:

没有提交按钮值被序列化，因为表单不是使用按钮提交的。

检查控制台的console.log(formdata) 的输出 - 你会看到submit 丢失了。而且由于它丢失了，您在后端对该值进行的测试将失败：

if(isset($_POST['submit'])){

具体如何解决这个问题取决于您要执行的操作。如果您只是想确保请求是 POST（而不是 GET），您可以使用：

if ($_SERVER['REQUEST_METHOD'] === 'POST') {

如果您想进行基本验证，您可以明确检查每个预期值是否存在：

if (isset($_POST['name']) && isset($_POST['email']) && isset($_POST['site'])) {

【讨论】：