通过 Ajax 从表单发送数据答案

【问题标题】：Sending data via Ajax from form通过 Ajax 从表单发送数据
【发布时间】：2016-08-25 21:12:58
【问题描述】：

我需要使用 Ajax 按 id 更新数据库中的行。

我的表单：

<form id="update_ajax">
     <input type="text" name="name" class="test_hide">
     <input type="hidden" name="id" value="<?php echo $row['id']; ?>">
     <input type="submit" value="<?php echo $row['id']; ?>" class="pure-button">
</form>

我的 Ajax 函数：

$("#update_ajax").on("submit", function () {
        var id = $(this).attr('id');
        var name = $(this).attr('name');
        var dataall={'id' : id, 'name' : name};
        $.ajax({
            type: "post",
            url: "update.php",
            data: dataall,
            success: function (data) {
                alert(data);
            }
        });
    });

我的 php 文件是：

if ((isset($_GET['id'])) && (isset($_GET['name']))) {
    $id = $_GET['id'];
    $name = $_GET['name'];
}else{
    die("Not set");
}
$pdo = new PDO("mysql:host=localhost;dbname=test", "root", "8169x5it");
$query = $pdo->prepare("UPDATE test SET name=:name WHERE id=:id");
$query->bindParam(':name', $name);
$query->bindParam(':id', $id);
$query->execute();

我的name 值未在$_GET['name'] 中设置的错误。我不明白为什么它没有设置。因为我是用数据发送的。

【问题讨论】：

var id = $(this).attr('id'); 不正确see docs
$(this).attr('name') 将未定义，因为表单没有 name 属性。你想要$("input[name=name]").val()。

标签： php jquery ajax ajaxform

【解决方案1】：

这是错误的：

var id = $(this).attr('id');
var name = $(this).attr('name');

$(this) 是表单，所以$(this).attr('id') 是"update_ajax"，而不是隐藏输入的值。并且$(this).attr('name') 是未定义的，因为表单没有name=something 属性。你真正想要的是：

var id = $(this).find("input[name=id]").val();
var name = $(this).find("input[name=name]").val();

但您可以将其全部简化为：

var dataall = $(this).serialize();

serialize() 将查找表单中的所有输入并返回包含所有值的 URL 编码字符串。

最后，您要么必须将 jQuery 更改为使用 type: 'GET'，要么将 PHP 更改为使用 $_POST 而不是 $_GET。

【讨论】：

谢谢！现在我明白了。
为什么当我按下更新时，它是一次更新而不重新加载页面，第二次它不重新加载就无法工作？我需要按 F5 来更新数据。
它有时有效，有时无效。可能是什么？
脚本应回显可用于更新页面的数据，success: 函数应使用它。
AJAX 的全部意义在于页面不会重新加载。您必须编写 Javascript 来对页面进行您想要的更改。

【解决方案2】：

你有什么，http://api.jquery.com/attr/

你想要什么http://api.jquery.com/val/

试一试，它应该可以正常工作，看起来不像您的源代码中的任何其他错误。如果不告诉我们。

编辑：

你也改变了：

$(this).attr('id');
$(this).attr('name');

到

$("input[name=id]").val();
$("input[name=name]").val();

或者

$(this).serialize();

稍后见https://api.jquery.com/serialize/

【讨论】：

他还需要更改选择器。