如何使用 jQuery AJAX 檢索 MySQL 資料？

使用jQuery AJAX 從MySQL 檢索資料

增強Web 應用程式的互動性需要一種穩健的方式來與伺服器通信，而無需刷新整個頁面。 jQuery AJAX 透過傳送非同步請求並處理來自伺服器的回應來提供此功能。在本例中，我們的目標是從 MySQL 資料庫檢索資料。

list.php 中提供的程式碼片段嘗試使用 jQuery AJAX 檢索記錄，但無法正常運作。為了解決這個問題，我們將製作一個改進版本，可以成功從 MySQL 表中檢索資料。

JavaScript 程式碼：

<script type="text/javascript">
$(document).ready(function() {
  $("#display").click(function() {
    $.ajax({
      type: "GET",
      url: "Records.php", 
      dataType: "html", 
      success: function(response) {                    
          $("#responsecontainer").html(response); 
      }
    });
  });
});
</script>

解釋：

• 文件就緒載入後執行已載入。
• 按一下「顯示」按鈕時，使用 $.ajax() 函數啟動 AJAX 請求。
• 使用以下命令將請求傳送至「Records.php」腳本GET 方法。
• 我們期望收到回應中的 HTML 數據，由 dataType: "html" 表示設定。
• 成功回應（HTTP 狀態碼 200）時，回應將填入「responsecontainer」div 元素中，從而有效地在頁面上顯示資料。

PHP程式碼：

連接：

<?php
$con=mysqli_connect("localhost","root","");
mysqli_select_db("simple_ajax",$con);

• 此部分建立Mys選擇“simple_ajax”資料庫。

查詢與回應：

$result=mysqli_query("select * from users",$con);
echo "<table border='1' >...";
while($data = mysqli_fetch_row($result)){ 
     // Display the fetched data in HTML table format 
}
echo "</table>";

• 查詢從「users」表中擷取所有記錄。
• 迭代結果，每行資料顯示在HTML 中

結論：

透過執行這些修改後的步驟，您可以使用jQuery AJAX 成功從MySQL 資料庫檢索資料並將其填入前端，如下所示想要的。這種方法可以實現動態和互動式 Web 應用程序，而無需重新載入整頁。

以上是如何使用 jQuery AJAX 檢索 MySQL 資料？的詳細內容。更多資訊請關注PHP中文網其他相關文章！