PHP နှင့် AJAX XML အမှတ်

AJAX 可与 XML 文件进行交互式通信。

AJAX XML 实例

在下面的 AJAX 实例中,我们将演示网页如何使用 AJAX 技术从 XML 文件中读取信息。

အောက်ပါ ဘွတ်အချက်အလက်များတွင် တစ်ခုကို ရွေးချယ်ပါ။

CD သတင်းကို အခြေခံပြု၍ သုံးပါသည်။

အမှတ်ပေးထားသော အကျိုးသတ္တိများ ပါဝင်သည်။ အောက်ပါ စာမျက်နှာများ ပါဝင်သည့််

  • အကြမ်းလျားသော HTML ပုံစံ
  • XML ဖိုင်
  • JavaScript ဖိုင်
  • PHP စာမျက်နှာ

HTML ပုံစံ

အထူးသဖြင့် အမှတ်ပေးထားသော အကျိုးသတ္တိသမျှ ကို ပါဝင်သည်။ HTML ပုံစံ သတင်းပေးသည့် အရာတစ်ခု နှင့် JavaScript ကို ဆက်သွယ်ထားသည့် ဘွတ်တစ်ခု ပါဝင်သည်။

<html>
<head>
<script src="selectcd.js"></script>
</head>
<body>
<form> 
Select a CD:
<select name="cds" onchange="showCD(this.value)">
<option value="Bob Dylan">Bob Dylan</option>
<option value="Bee Gees">Bee Gees</option>
<option value="Cat Stevens">Cat Stevens</option>
</select>
</form>
<p>
<div id="txtHint"><b>CD info will be listed here.</b></div>
</p>
</body>
</html>

အကျိုးသမား အချက်အလက်

သင်မြင်တွေ့လျှင် သင်မှာ အကျယ်အဝန်းအရ အနည်းငယ်သော HTML အုပ်စံပါ တွင် "cds" အမည်ရှိ နှဲ့သွားသော ကျယ်ပြန်သတင်းအရာများပါဝင်သည်。

ပထမဆုံးအုပ်စံပါ အကျယ်အဝန်းအရ "txtHint" အမည်ရှိ div ကို ပါဝင်သည်။ ဤ div ကို web ဆိုင်းဖိုင်အချက်အလက်များကို အခြေခံပြီး သုံးသည်。

အသုံးပြုသူသည် ရွေးချယ်သော အချက်အလက်အား အသုံးပြုရာတွင် showCD အမည်ရှိ သတင်းအရာကို အခြေခံပြီး အခြေခံပြီးတွင် "onchange" ဖြစ်ပေါ်သော အခင်းအမြစ်ကို ခေါ်ဆိုသည်。

ထို့ကြောင့် အသုံးပြုသူသည် နှဲ့သွားသော ကျယ်ပြန်သတင်းအရာများကို ပြသည့် showCD သတင်းအရာကို ခေါ်ဆိုသည်。

XML ဖိုင်

XML ဖိုင် "cd_catalog.xml“. ဤဖိုင်တွင် CD ကိုင်တာများနှင့်သက်ဆိုင်သော အချက်အလက်များပါဝင်သည်。”

JavaScript

ဤဖော်ပြထားသော JavaScript စကာတင် "selectcd.js" ဖိုင်တွင် သို့မဟုတ်သည်:

var xmlHttp
function showCD(str)
{ 
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
 {
 alert ("Browser does not support HTTP Request")
 return
 } 
var url="getcd.php"
url=url+"?q="+str
url=url+"&sid="+Math.random()
xmlHttp.onreadystatechange=stateChanged 
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
}
function stateChanged() 
{ 
 if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
 { 
 document.getElementById("txtHint").innerHTML=xmlHttp.responseText; 
 } 
}
function GetXmlHttpObject()
{
var xmlHttp=null;
try
 {
 // Firefox, Opera 8.0+, Safari
 xmlHttp=new XMLHttpRequest();
 }
catch (e)
 {
 // Internet Explorer
 try
  {
  xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
  }
 catch (e)
  {
  xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
 }
return xmlHttp;
}

အကျိုးသမား အချက်အလက်

stateChanged() နှင့် GetXmlHttpObject အသုံးပြုထားသော အရာဝတ္တု သည် အထိပ်တန်း တွင် အတိုင်းအတာ အတူ ဖြစ်ပြီး အခြား အစီအစဉ် တွင် ကြည့်ခွင့်ပြုထားသည်။

showCD() အသုံးပြုထားသော ပုံစံ

အဆိုပါ အချက်အလက် ကို အသုံးပြုထားသော ပေါင်းစပ်သင်း ကို ကြိုးပမ်းထားသော အခါတွင် ပုံစံကို အပြင်ပို့ကြောင်း

  1. GetXmlHttpObject အသုံးပြုထားသော အရာဝတ္တု ကို ဖွင့်ကြောင်း
  2. အင်တာနက် သို့ ပေးပို့သော URL ကို အသုံးပြုထားသော အဆိုပါ အချက်အလက်
  3. URL သို့ ကျန်းမာစွမ်း အချက်အလက် ပါဝင်သော ပေါင်းစပ်သင်း ကို ပေးပို့ခြင်း
  4. အင်တာနက် အမှတ်ကို ပြင်ဆင်ထားသည် အကြောင်း အမျိုးမျိုး ကို ကာကွယ်ကြောင်း
  5. အခြေစာ ဖြစ်သော ဖြစ်ပေါ်သည် အခါတွင် stateChanged ကို ခေါ်ခဲ့သည်
  6. အခြေစာ URL ကို ဖော်ထုတ်ထားသော XMLHTTP အရာဝတ္တု ကို ဖွင့်ကြောင်း
  7. အင်တာနက် အင်္ဂါတရပ် ကို ချက်ချင်း ပေးပို့ခြင်း

PHP စာမျက်နှာ

ဒီ အင်တာနက် စာမျက်နှာက လက်ဆုံးဖြတ်သူများ ကို အသုံးပြုထားသော အင်တာနက် စာမျက်နှာများ တစ်ခု ဖြစ်ပြီး "getcd.php" အမည်ရှိ ပုံစံအားကစားစက် အဆိုပါ ပုံစံကို ပြထားသည်။

ဒီ စာမျက်နှာက ပြင်ဆင်ထားသော အချက်အလက်များ သည် PHP ကို အသုံးပြု၍ အိမ်အခြေစာ XML အချက်အလက်ကို သို့မဟုတ် အသုံးပြုထားသည်။cd_catalog.xml"。

ပုံစံအားကစားသော ယာဉ်ကို စီစဥ်ထားသော အချက်အလက်များကို တုံ့ပြန်၍ ဟောင်းငွေထုတ်စားစက်များ ကို ပြထားသည်။

<?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($cd->item($i)->nodeName);
  echo(": ");
  echo($cd->item($i)->childNodes->item(0)->nodeValue);
  echo("<br />");
  } 
}
?>

အကျိုးသုံး အကြောင်းပြချက်

JavaScript က PHP စာကြိုး ကို ပေးပို့ ခြင်း ဖြစ်သော အခါ

  1. PHP "cd_catalog.xml" ပုံစံ ဖြင့် XML DOM အားစီစဉ်
  2. all "artist" အရာများ ကို လှည့်ဖတ် လုပ် (nodetypes = 1),JavaScript က ပေးပို့သော အမည် နှင့် ကွဲထွက်သော အမည်ကို ရှာဖွေ
  3. CD ပါဝင်သော ကျမ်းစာအရာ ဖြစ်သော artist ကို တွေ့ရှိ
  4. album အချက်အလက် ပြုပြင်၍ "txtHint" အစားထိုး ကို ပေးပို့