Ví dụ về PHP - AJAX và XML
AJAX có thể được sử dụng để giao tiếp tương tác với tệp XML.
Ví dụ XML AJAX
Ví dụ sau đây sẽ minh họa cách một trang web có thể tìm nạp thông tin từ tệp XML bằng AJAX:
Ví dụ
Giải thích ví dụ - Trang HTML
Khi người dùng chọn một đĩa CD trong danh sách thả xuống ở trên, một hàm có tên "showCD()" sẽ được thực thi. Chức năng này được kích hoạt bởi sự kiện "onchange":
<html>
<head>
<script>
function showCD(str)
{
if (str=="") {
document.getElementById("txtHint").innerHTML="";
return;
}
var xmlhttp=new XMLHttpRequest();
xmlhttp.onreadystatechange=function() {
if (this.readyState==4 && this.status==200) {
document.getElementById("txtHint").innerHTML=this.responseText;
}
}
xmlhttp.open("GET","getcd.php?q="+str,true);
xmlhttp.send();
}
</script>
</head>
<body>
<form>
Select a CD:
<select name="cds" onchange="showCD(this.value)">
<option value="">Select a CD:</option>
<option value="Bob Dylan">Bob Dylan</option>
<option value="Bee Gees">Bee Gees</option>
<option value="Cat Stevens">Cat Stevens</option>
</select>
</form>
<div id="txtHint"><b>CD info will be listed here...</b></div>
</body>
</html>
Hàm showCD() thực hiện như sau:
- Kiểm tra xem CD đã được chọn chưa
- Tạo một đối tượng XMLHttpRequest
- Tạo hàm để thực thi khi phản hồi của máy chủ sẵn sàng
- Gửi yêu cầu đến một tập tin trên máy chủ
- Lưu ý rằng một tham số (q) được thêm vào URL (với nội dung của danh sách thả xuống)
Tệp PHP
Trang trên máy chủ được gọi bằng JavaScript ở trên là một tệp PHP có tên "getcd.php".
Tập lệnh PHP tải một tài liệu XML, " cd_catalog.xml ", chạy truy vấn đối với tệp XML và trả về kết quả dưới dạng HTML:
<?php
$q=$_GET["q"];
$xmlDoc = new DOMDocument();
$xmlDoc->load("cd_catalog.xml");
$x=$xmlDoc->getElementsByTagName('ARTIST');
for ($i=0; $i<=$x->length-1; $i++)
{
//Process only element nodes
if ($x->item($i)->nodeType==1) {
if ($x->item($i)->childNodes->item(0)->nodeValue == $q) {
$y=($x->item($i)->parentNode);
}
}
}
$cd=($y->childNodes);
for ($i=0;$i<$cd->length;$i++)
{
//Process only element nodes
if ($cd->item($i)->nodeType==1) {
echo("<b>" . $cd->item($i)->nodeName . ":</b> ");
echo($cd->item($i)->childNodes->item(0)->nodeValue);
echo("<br>");
}
}
?>
Khi truy vấn CD được gửi từ JavaScript đến trang PHP, điều sau sẽ xảy ra:
- PHP tạo một đối tượng XML DOM
- Tìm tất cả phần tử <artist> khớp với tên được gửi từ JavaScript
- Xuất thông tin album (gửi tới phần giữ chỗ "txtHint")