序列化表单并使用 POST 方法使用 ajax 发送序列化数据答案

【问题标题】：serialize a form and send the serialized data with ajax using POST method序列化表单并使用 POST 方法使用 ajax 发送序列化数据
【发布时间】：2016-06-24 11:17:46
【问题描述】：

我正在尝试序列化表单并使用 POST 方法使用 ajax 发送序列化数据..

index.php

<form id ="form" class = "form">
        <input type = "text" name = "name" />           
        <input type = "number" name = "age" />
        <input type = "number" name = "id" />
        <input type = "submit" name = "submit"><br/>
</form>
<p id = "result"></p>

jquery sn-ps

<script>
    $(document).ready(function(){
        $("#form").submit(function(){
            var data = $("#form").serialize();
            insertStudent(data);
            return false ;
        });
        function insertStudent(data){
            $.post("process.php" , { data : data} , function(str){
            $("#result").html(str);
            });                 
        }
   });
</script>

进程.php

$ret = $_POST["data"];
echo "<br />".$ret["name"];

现在，结果是：

注意：未定义的索引：第 3 行 C:\xampp\htdocs\try.php 中的名称

当我尝试回显 $_POST["data"] 结果是：

name=Ahmed&age=111&id=222

如何单独使用每个名称，例如：$_POST["name"] ... $_POST["age"] ... $_POST["id"]？

【问题讨论】：

GET 是表单的默认值，你没有method='post'
@Dagon $.post 是属性 method='post' 的替代品

标签： php jquery ajax forms post

【解决方案1】：

    function insertStudent(data){
        $.ajax({
            url: 'process.php',
            data: data,
            type: 'POST',
            dataType: 'json',
            success: function(str){
                 $("#result").html(str);
            }
        });     
    }

然后在你的 PHP 文件中打印 $_POST :)

【讨论】：

如何在 PHP 文件中单独捕获每个元素
print_r($_POST);你会看到 :) 它们将作为普通的 post 数组出现，访问它们 $_POST['name']... e.t.c.

【解决方案2】：

问题在于您将数据发送到服务器的方式：

{data: data}

将您的序列化数据转换为一个参数，而不是 serialize() 收集的一系列参数。只需将其更改为：

data

编辑（添加了明确的示例）：以下（和以上）有效。如果它对您不起作用，则您的 php 代码中还有其他错误。

index.php:

    <?php
echo '<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script>
    $(document).ready(function(){
        $("#form").submit(function(){

            var data = $("#form").serialize();
            insertStudent(data);
            return false ;
        });
        function insertStudent(data){

            $.post("process.php" , data , function(str){
            $("#result").html(str);

            });                 
        }
   });
</script>
</head>
<body>
<p>test of form</p>
<form id ="form" class = "form">
        <input type = "text" name = "name" />           
        <input type = "number" name = "age" />
        <input type = "number" name = "id" />
        <input type = "submit" name = "submit"><br/>
</form>
<p id="result"></p>
</body>
</html>';
?>

进程.php：

<?php
print_r($_POST);
echo "<br/>"; 
foreach($_POST as $key=>$value){
    echo $key.": '".$value."'<br/>";
}
?>

输出结果：

Array ( [name] => Whatevernameyoutype [age] => whateverageyoutype [id] => whateveridyoutype ) 
name: 'Whatevernameyoutype'
age: 'whateverageyoutype'
id: 'whateveridyoutype'

您可以使用 $_POST["KEYNAMEHERE"]; 访问任何已发布的参数，而不是循环，

【讨论】：

用上面的方法再试一次。如果您仍然收到错误消息，则说明您的 php 代码有其他问题。