AJAX می‌تواند برای ارتباط تعاملی با یک فایل XML استفاده شود.
مثال AJAX با XML
مثال زیر نشان می‌دهد که چگونه یک صفحه وب می‌تواند اطلاعات را از یک فایل XML با استفاده از AJAX واکشی کند:
<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>توضیح مثال - صفحه HTML
در مثال بالا، هنگامی که کاربر یک CD را از لیست کشویی انتخاب می‌کند، تابعی به نام showCD() اجرا می‌شود. این تابع با رویداد onchange فراخوانی می‌شود.
تابع showCD()
این تابع کارهای زیر را انجام می‌دهد:
- بررسی می‌کند که آیا یک CD انتخاب شده است.
- ایجاد یک شیء
XMLHttpRequest - ایجاد تابعی که هنگام آماده شدن پاسخ سرور اجرا شود.
- ارسال درخواست به یک فایل در سرور.
- اضافه کردن یک پارامتر (
q) به URL (با محتوای لیست کشویی)
فایل PHP
صفحه‌ای که توسط جاوااسکریپت فراخوانی می‌شود، یک فایل PHP به نام getcd.php است.
اسکریپت PHP یک سند XML به نام cd_catalog.xml را بارگذاری می‌کند، یک کوئری در برابر فایل XML اجرا می‌کند و نتیجه را به صورت 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++) {
// پردازش فقط نودهای عنصر
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++) {
// پردازش فقط نودهای عنصر
if ($cd->item($i)->nodeType == 1) {
echo("<b>" . $cd->item($i)->nodeName . ":</b> ");
echo($cd->item($i)->childNodes->item(0)->nodeValue);
echo("<br>");
}
}
?>توضیحات
هنگامی که کوئری CD از جاوااسکریپت به صفحه PHP ارسال می‌شود، مراحل زیر انجام می‌شود:
- PHP یک شیء XML DOM ایجاد می‌کند.
- تمام عناصر
<artist>را که با نام ارسال شده از جاوااسکریپت مطابقت دارند، پیدا می‌کند. - اطلاعات آلبوم را تولید کرده و به مکان‌نما
txtHintارسال می‌کند.
این روش به شما امکان می‌دهد تا به صورت دینامیک و بدون نیاز به بارگذاری مجدد کل صفحه، اطلاعات را از فایل XML واکشی و نمایش دهید.
برای ارسال نظر لطفا ابتدا وارد حساب کاربری خود شوید. صفحه ورود و ثبت نام