首頁 後端開發 php教程 如何使用 AJAX 和 PHP 有效地將多個表單輸入提交到資料庫而無需刷新頁面?

如何使用 AJAX 和 PHP 有效地將多個表單輸入提交到資料庫而無需刷新頁面?

Dec 04, 2024 am 07:02 AM

How can I use AJAX and PHP to efficiently submit multiple form inputs to a database without page refresh?

AJAX 和PHP 用於將多個表單輸入輸入資料庫

在本文中,我們將探討如何利用AJAX 和PHP 來輸入將多個表單輸入到資料庫中。由於您是 AJAX 新手,我們的重點將是理解 AJAX 在此上下文中的概念和應用。

首先,讓我們考慮一下用 PHP 產生的以下範例表單:

<?php

   echo "<form method='post'>";

   $i=1;

    while($i <= $num_to_enter){

    $form_output .= "First Name:

    <input>
登入後複製

此表單根據使用者選擇動態產生多組輸入欄位('$num_to_enter')。我們的目標是使用 AJAX 將這些輸入欄位中的資料傳送到 PHP 腳本以進行資料庫插入。

關於您提供的 AJAX 函數,主要問題是在以下情況下錯誤使用了「&」字元:連接資料字串。此外,AJAX 呼叫外部的「while」迴圈會導致發送空資料。

這是AJAX 函數的更正版本:

function MyFunction(){

  var i = 1;
  var x = $('#num_to_enter').val(); // Get the number of form sets

  var dataString = ''; // Initialize an empty data string

  // Iterate through the number of form sets
  while (i <= x){

    // Concatenate the data string using JavaScript's += operator
    dataString += "fname[" + i + "]=" + $('#fname[' + i + ']').val() + "&";
    dataString += "lname[" + i + "]=" + $('#lname[' + i + ']').val() + "&";
    dataString += "email[" + i + "]=" + $('#email[' + i + ']').val() + "&";

    i++;
  }

  // Remove the trailing '&' character from the data string
  dataString = dataString.substr(0, dataString.length - 1);

  // Send the data via AJAX to the 'process.php' script
  $.ajax({
    url: 'process.php', 
    type: 'POST', 
    data: dataString, // The concatenated data string is passed here
    success: function(data){

      // Handle the response from 'process.php'
      // Your code goes here
    },
    complete: function(){
      // Perform tasks after the AJAX request is complete
      // Your code goes here
    }
  });
}
登入後複製

在此更正後的函數中,我們適當地串聯將資料轉換為單一字串('dataString') 並將其作為AJAX 中的'data' 參數傳遞

對於PHP腳本('process.php'),我們可以有這樣的內容:

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

    // Parse the data from the POST request
    parse_str($_POST['data'], $formData);

    // Extract the individual data sets
    $fnames = $formData['fname'];
    $lnames = $formData['lname'];
    $emails = $formData['email'];

    // Initialize the success flag
    $success = true;

    // Perform the database insertions
    for ($i = 0; $i < count($fnames); $i++) {

      // Insert into database
      // ...

      // Check if any insertion failed
      if(!...){
        $success = false;
        break;
      }
    }

    // Return the success flag as JSON
    echo json_encode(array('success' => $success));
  }
?>
登入後複製

在這個 PHP 腳本中,我們解析 POST 數據,提取單個數據數據集,並循環它們以執行數據庫插入。如果任何插入失敗,「成功」標誌將設定為 false。最後,我們將「成功」標誌作為 JSON 傳回 AJAX 呼叫。

這種方法使您能夠透過 AJAX 非同步提交多個表單集,並在 PHP 腳本中處理資料庫插入,從而提供更流暢的使用者體驗,而無需任何操作。刷新頁面。

以上是如何使用 AJAX 和 PHP 有效地將多個表單輸入提交到資料庫而無需刷新頁面?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱門文章

倉庫:如何復興隊友
3 週前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒險:如何獲得巨型種子
3 週前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
1 週前 By 尊渡假赌尊渡假赌尊渡假赌

熱門文章

倉庫:如何復興隊友
3 週前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒險:如何獲得巨型種子
3 週前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
1 週前 By 尊渡假赌尊渡假赌尊渡假赌

熱門文章標籤

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

11個最佳PHP URL縮短腳本(免費和高級) 11個最佳PHP URL縮短腳本(免費和高級) Mar 03, 2025 am 10:49 AM

11個最佳PHP URL縮短腳本(免費和高級)

在Laravel中使用Flash會話數據 在Laravel中使用Flash會話數據 Mar 12, 2025 pm 05:08 PM

在Laravel中使用Flash會話數據

簡化的HTTP響應在Laravel測試中模擬了 簡化的HTTP響應在Laravel測試中模擬了 Mar 12, 2025 pm 05:09 PM

簡化的HTTP響應在Laravel測試中模擬了

Instagram API簡介 Instagram API簡介 Mar 02, 2025 am 09:32 AM

Instagram API簡介

構建具有Laravel後端的React應用程序:第2部分,React 構建具有Laravel後端的React應用程序:第2部分,React Mar 04, 2025 am 09:33 AM

構建具有Laravel後端的React應用程序:第2部分,React

php中的捲曲:如何在REST API中使用PHP捲曲擴展 php中的捲曲:如何在REST API中使用PHP捲曲擴展 Mar 14, 2025 am 11:42 AM

php中的捲曲:如何在REST API中使用PHP捲曲擴展

在Codecanyon上的12個最佳PHP聊天腳本 在Codecanyon上的12個最佳PHP聊天腳本 Mar 13, 2025 pm 12:08 PM

在Codecanyon上的12個最佳PHP聊天腳本

宣布 2025 年 PHP 形勢調查 宣布 2025 年 PHP 形勢調查 Mar 03, 2025 pm 04:20 PM

宣布 2025 年 PHP 形勢調查

See all articles