Contoh PHP - AJAX dan XML
AJAX dapat digunakan untuk komunikasi interaktif dengan file XML.
Contoh XML AJAX
Contoh berikut akan menunjukkan bagaimana halaman web dapat mengambil informasi dari file XML dengan AJAX:
Contoh
CD info will be listed here...
Contoh Dijelaskan - Halaman HTML
Ketika pengguna memilih CD dalam daftar dropdown di atas, fungsi yang disebut "showCD()" dijalankan. Fungsi dipicu oleh peristiwa "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>
Fungsi showCD() melakukan hal berikut:
- Periksa apakah CD dipilih
- Buat objek XMLHttpRequest
- Buat fungsi yang akan dieksekusi ketika respons server sudah siap
- Kirim permintaan ke file di server
- Perhatikan bahwa parameter (q) ditambahkan ke URL (dengan konten daftar dropdown)
File PHP
Halaman di server yang disebut oleh JavaScript di atas adalah file PHP yang disebut "getcd.php".
Skrip PHP memuat dokumen XML, " cd_catalog.xml ", menjalankan kueri terhadap file XML, dan mengembalikan hasilnya sebagai 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>");
}
}
?>
Ketika kueri CD dikirim dari JavaScript ke halaman PHP, hal berikut terjadi:
- PHP membuat objek XML DOM
- Temukan semua elemen <artist> yang cocok dengan nama yang dikirim dari JavaScript
- Keluarkan informasi album (kirim ke placeholder "txtHint")