如何使用 AJAX 和 PHP 将多个表单输入保存到数据库？

使用 AJAX 和 PHP 将多个表单输入保存到数据库

AJAX（异步 JavaScript 和 XML）允许在一个网络浏览器和一个服务器，无需刷新页面。在这种情况下，它可用于使用 PHP 将表单输入传输到数据库。

实现

HTML 表单

生成具有多个输入字段的表单，确保它们的名称对应于您想要的 PHP $_POST 变量

Ajax 函数

制作如下 JavaScript 函数来处理表单提交：

function saveData() {
  // Collect all input values
  var inputs = $("input[type=text]");
  var data = {};
  $.each(inputs, function() {
    data[$(this).attr("name")] = $(this).val();
  });

  // Convert data to JSON
  var jsonData = JSON.stringify(data);

  // Send data to PHP file via AJAX
  $.ajax({
    url: "save.php",
    type: "POST",
    data: { data: jsonData },
    dataType: "json",
    success: function(response) {
      if (response.success) {
        alert("Data saved successfully.");
      } else {
        alert("Error saving data.");
      }
    }
  });
}

PHP 脚本

save.php中，解码JSON数据并执行数据库操作：

<?php
// Decode JSON data
$data = json_decode($_POST['data']);

// Connect to database and execute query
// ...

// Prepare response
$response = array();
if ($result) {
  $response['success'] = true;
} else {
  $response['success'] = false;
}

// Encode response as JSON and echo
echo json_encode($response);

附加说明

• 序列化表单数据：您可以使用表单来代替手动收集输入值。 Serialize() 创建形式的字符串表示形式data.
• 自定义输入名称： 提供的示例假定连续的数字输入名称。如果您有自定义输入名称，请相应地修改 JavaScript 代码。
• JSON 解析：如果您是 JSON 新手，请参阅 MDN 等资源以获取有关在 JavaScript 中解析 JSON 的指南。

以上是如何使用 AJAX 和 PHP 将多个表单输入保存到数据库？的详细内容。更多信息请关注PHP中文网其他相关文章！