隨著網路和行動應用程式的發展,動態頁面和即時查詢資料的需求越來越高。 AJAX (Asynchronous JavaScript and XML) 正是一個幫助開發者實現非同步資料傳輸和動態頁面更新的技術。本文將介紹如何使用AJAX和PHP從資料庫查詢數據,並在前端呈現。
首先,我們需要建立一個簡單的資料庫,用於儲存資料。這裡我們以“students”表為例,包含“id”,“name”和“age”三個字段,儲存學生的基本資訊。
建立好資料庫後,我們需要使用PHP連接資料庫,並且寫查詢語句。以下是一個簡單的查詢操作程式碼:
<?php $servername = "localhost"; $username = "username"; $password = "password"; $dbname = "myDB"; // 创建连接 $conn = new mysqli($servername, $username, $password, $dbname); // 检查连接是否成功 if ($conn->connect_error) { die("连接失败: " . $conn->connect_error); } $sql = "SELECT * FROM students"; $result = $conn->query($sql); // 处理查询结果 if ($result->num_rows > 0) { // 输出每行数据 while($row = $result->fetch_assoc()) { echo "学生ID: " . $row["id"]. " - 姓名: " . $row["name"]. " - 年龄: " . $row["age"]. "<br>"; } } else { echo "0 结果"; } $conn->close(); ?>
上述程式碼使用了mysqli連接MySQL資料庫,並執行了一個簡單的查詢操作,將查詢結果輸出到了前端頁面。在實際開發中,可能需要自訂要查詢的內容,以及過濾和排序等操作。
接下來,我們需要使用AJAX技術來非同步請求伺服器端數據,並將結果呈現在前端頁面上。以下是一個簡單的AJAX查詢操作的程式碼:
<script> function showData(str) { if (str=="") { document.getElementById("result").innerHTML=""; return; } var xmlhttp=new XMLHttpRequest(); xmlhttp.onreadystatechange=function() { if (this.readyState==4 && this.status==200) { document.getElementById("result").innerHTML=this.responseText; } } xmlhttp.open("GET","getdata.php?q="+str,true); xmlhttp.send(); } </script>
上述程式碼首先定義了一個showData函數,用於發送非同步請求並接受伺服器端傳回的資料。在選擇方塊中選擇一個學生後,呼叫showData函數,並將所選學生的ID作為參數傳入。
AJAX請求使用了XMLHttpRequest對象,透過open方法指定GET請求的URL位址和參數,並透過send方法發送請求。當請求傳回200狀態碼時,說明查詢成功,呼叫onreadystatechange函數,並將伺服器端傳回的資料作為responseText屬性的值,將資料顯示在前端頁面上。如果請求失敗,可以透過status屬性取得失敗狀態碼和錯誤訊息。
最後,我們需要編寫一個用於接受查詢請求並從資料庫查詢資料的PHP腳本。以下是一個簡單的PHP腳本的程式碼:
<?php $q = $_GET['q']; $con = mysqli_connect('localhost','username','password','myDB'); if (!$con) { die('Could not connect: ' . mysqli_error($con)); } mysqli_select_db($con,"students"); $sql="SELECT * FROM students WHERE id = '".$q."'"; $result = mysqli_query($con,$sql); echo "<table> <tr> <th>ID</th> <th>Name</th> <th>Age</th> </tr>"; while($row = mysqli_fetch_array($result)) { echo "<tr>"; echo "<td>" . $row['id'] . "</td>"; echo "<td>" . $row['name'] . "</td>"; echo "<td>" . $row['age'] . "</td>"; echo "</tr>"; } echo ""; mysqli_close($con); ?>
上述程式碼先讀取AJAX請求中傳來的參數,然後連接到MySQL資料庫,執行一個有where條件的查詢語句,將查詢結果以HTML表格的形式傳回前端頁面。
綜上,AJAX和PHP相結合查詢資料庫資料並在前端呈現是一個常見的動態網頁開發需求,透過合理的使用這些技術,我們可以快速地實現一個完整的動態頁面。
以上是ajax php怎麼查詢資料庫數據的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本文比較了酸和基本數據庫模型,詳細介紹了它們的特徵和適當的用例。酸優先確定數據完整性和一致性,適合財務和電子商務應用程序,而基礎則側重於可用性和

本文討論了確保PHP文件上傳的確保,以防止諸如代碼注入之類的漏洞。它專注於文件類型驗證,安全存儲和錯誤處理以增強應用程序安全性。

本文討論了在PHP中實施API速率限制的策略,包括諸如令牌桶和漏水桶等算法,以及使用Symfony/Rate-limimiter之類的庫。它還涵蓋監視,動態調整速率限制和手

本文討論了使用password_hash和pyspasswify在PHP中使用密碼的好處。主要論點是,這些功能通過自動鹽,強大的哈希算法和SECH來增強密碼保護

本文討論了OWASP在PHP和緩解策略中的十大漏洞。關鍵問題包括注射,驗證損壞和XSS,並提供用於監視和保護PHP應用程序的推薦工具。


熱AI工具

Undresser.AI Undress
人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool
免費脫衣圖片

Clothoff.io
AI脫衣器

Video Face Swap
使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱門文章

熱工具

MantisBT
Mantis是一個易於部署的基於Web的缺陷追蹤工具,用於幫助產品缺陷追蹤。它需要PHP、MySQL和一個Web伺服器。請查看我們的演示和託管服務。

EditPlus 中文破解版
體積小,語法高亮,不支援程式碼提示功能

ZendStudio 13.5.1 Mac
強大的PHP整合開發環境

Safe Exam Browser
Safe Exam Browser是一個安全的瀏覽器環境,安全地進行線上考試。該軟體將任何電腦變成一個安全的工作站。它控制對任何實用工具的訪問,並防止學生使用未經授權的資源。

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