AJAX と PHP を使用して複数のフォーム入力をデータベースに保存するにはどうすればよいですか?

AJAX と PHP を使用して複数のフォーム入力をデータベースに保存する

AJAX (非同期 JavaScript と XML) により、相互間のリアルタイム データ交換が可能になります。ページを更新せずに Web ブラウザとサーバーを実行できます。このコンテキストでは、PHP を使用してフォーム入力をデータベースに転送するために使用できます。

実装

HTML フォーム

複数の入力フィールドを含むフォームを生成し、その名前が目的の PHP $_POST 変数に対応していることを確認します。 access.

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 Script

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() を使用して、フォーム データの文字列表現を作成します。
• カスタム入力名前: この例では、連続する数値入力名を想定しています。カスタム入力名がある場合は、それに応じて JavaScript コードを変更します。
• JSON 解析: JSON を初めて使用する場合は、JavaScript での JSON 解析に関するガイダンスについて MDN などのリソースを参照してください。

以上がAJAX と PHP を使用して複数のフォーム入力をデータベースに保存するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。