PHP - AJAX 与 MySQL

AJAX 可用于与数据库进行交互式通信。

AJAX 数据库实例

下例将演示网页如何使用 AJAX 从数据库中获取信息：

实例

在下拉列表中选择一个客户：

实例解释 - MySQL 数据库

将在本例中使用的数据库看起来类似这样：

id CustomerID CompanyName ContactName Address City PostalCode Country
1 Alibaba Alibaba Group Ma Yun ...... Hangzhou 310002 China
2 APPLE Apple Inc. Tim Cook ...... Cupertino 95014 USA
3 BAIDU BAIDU Inc. Li YanHong ...... Beijing 100080 China
4 Canon Canon USA Inc. Tsuneji Uchida ...... New York 11042 USA

例子解释：

在上面的例子中，当用户在上面的下拉列表中选择客户时，会执行一个名为 showUser() 的函数。

该函数由 onchange 事件触发。

这是 HTML 代码：

实例

<html>
<head>
<script>
function showUser(str) {
  if (str == "") {
    document.getElementById("txtHint").innerHTML = "";
    return;
  } else {
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function() {
      if (this.readyState == 4 && this.status == 200) {
        document.getElementById("txtHint").innerHTML = this.responseText;
      }
    };
    xmlhttp.open("GET","getuser.php?q="+str,true);
    xmlhttp.send();
  }
}
</script>
</head>
<body>

<form>
<select name="users" onchange="showUser(this.value)">
	<option value="">请选择一个客户：</option>
	<option value="1">Alibaba</option>
	<option value="2">APPLE</option>
	<option value="3">BAIDU</option>
	<option value="4">Canon</option>
	<option value="5">Google</option>
	<option value="6">HUAWEI</option>
	<option value="7">Microsoft</option>
	<option value="8">Nokia</option>
	<option value="9">SONY</option>
	<option value="10">Tencent</option>
</select>
</form>
<br>

<div id="txtHint"><b>人员信息将在此处列出...</b></div>

</body>
</html>

运行实例

例子解释：

首先，检查是否选择了任何客户。如果没有选择人员（str == ""），则清除 txtHint 的内容并退出函数。

如果选择了某个客户，则执行以下操作：

  • 创建 XMLHttpRequest 对象
  • 创建服务器响应就绪时要执行的函数
  • 将请求发送到服务器上的文件
  • 请注意，URL 中添加了一个参数 q（带有下拉列表的内容）

PHP 文件

上面 JavaScript 调用的服务器上的页面是一个名为 getuser.php 的 PHP 文件。

getuser.php 中的源代码针对 MySQL 数据库运行查询，并将结果以 HTML 表格的形式返回：

getuser.php

$q = intval($_GET['q']);

$con = mysqli_connect('MyServer','MyUser','MyPassword');
if (!$con) {
  die('无法连接：' . mysqli_error($con));
}

mysqli_select_db($con,"ajax_demo");
$sql="SELECT * FROM user WHERE id = '".$q."'";
$result = mysqli_query($con,$sql);

echo "<table>";
while($row = mysqli_fetch_array($result)) {
    echo "<tr><th>CustomerID</th><td>" . $row['CustomerID'] . "</td></tr>";
    echo "<tr><th>CompanyName</th><td>" . $row['CompanyName'] . "</td></tr>";
    echo "<tr><th>ContactName</th><td>" . $row['ContactName'] . "</td></tr>";
    echo "<tr><th>Address</th><td>" . $row['Address'] . "</td></tr>";
    echo "<tr><th>City</th><td>" . $row['City'] . "</td></tr>";
    echo "<tr><th>PostalCode</th><td>" . $row['PostalCode'] . "</td></tr>";
    echo "<tr><th>Country</th><td>" . $row['Country'] . "</td></tr>";
}
echo "</table>";

mysqli_close($con);

例子解释：

当从 JavaScript 向 PHP 文件发送查询时，会发生以下情况：

  1. PHP 打开与 MySQL 服务器的连接
  2. 找到正确的人员
  3. 创建一个 HTML 表格，填充数据，并将其发送回 txtHint 占位符