随着互联网和移动应用的发展,动态页面和实时查询数据的需求越来越高。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查询操作的代码:
<html> <head> <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> </head> <body> <form> <select name="students" onchange="showData(this.value)"> <option value="">请选择一个学生:</option> <option value="1">小明</option> <option value="2">小红</option> <option value="3">小刚</option> </select> </form> <br> <div id="result"><b>这里会显示查询到的学生信息</b></div> </body> </html>
上述代码首先定义了一个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 "</table>"; mysqli_close($con); ?>
上述代码先读取AJAX请求中传来的参数,然后连接到MySQL数据库,执行一个带有where条件的查询语句,将查询结果以HTML表格的形式返回给前端页面。
综上,AJAX和PHP相结合查询数据库数据并在前端呈现是一个常见的动态网页开发需求,通过合理的使用这些技术,我们可以快速地实现一个完整的动态页面。
以上是ajax php怎么查询数据库数据的详细内容。更多信息请关注PHP中文网其他相关文章!