Mfano wa XML wa AJAX kwa PHP

AJAX inaweza kumtabaka na faili ya XML kwa muhimu.

Mfano wa AJAX wa XML

Mfano wa AJAX wa XML, tutakutambua kama hali ya tovuti inaendelea kusema AJAX kwa sababu ya teknolojia ya XML.

Chagua CD kwenye orodha hii inayotumiwa kwenye hali ya AJAX:

Kuelewa au kufaa CD hii.

Mfano hii inaonyesha sayari tatu:

  • Fomu ya HTML ya kwanza
  • Faili ya XML
  • Faili ya JavaScript
  • Sayari ya PHP

Fomu ya HTML

Mfano hii inaonyesha fomu ya HTML ya kwanza, na kisia kwa JavaScript:

<html>
<head>
<script src="selectcd.js"></script>
</head>
<body>
<form> 
Chagua 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>Info ya CD itaorodheshwa hapa.</b></div>
</p>
</body>
</html>

Maelezo ya mivuno:

Kama unavyofikia, hii ni formu ya HTML ya kawaida iliyokadiriwa na chagua cha "cds".

Uangalifu wa forma ina divi ya "txtHint". Divi hii inatumiwa kama kichwako cha data ya kusomolea kutoka kwa mtandao wa web.

Kwa kila wakati mtu anachagua data, inatendeka funguli ya showCD. Kufanya kazi ya funguli hii inapatikana kwa matukio ya onchange.

Kuzingatia, kila wakati mtu anashindana na ukurasa wa chagua, showCD inarudi.

Faili cha XML

Faili cha XML ni "cd_catalog.xml". Faili hii ina zawadi za data ya CD.

JavaScript

Hii ni koodi cha JavaScript ambacho haujafikia kwa faili "selectcd.js":

var xmlHttp
function showCD(str)
{ 
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
 {
 alert ("Mashambulizi hau kufaaanishwa kwa Mwajibu wa HTTP")
 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;
}

Maelezo ya mivuno:

Funguo za stateChanged() na GetXmlHttpObject zinaendelea kama za uharibifu wa awali, unaweza kuona uharibifu wa kuzingatia maelezo ya wakati huu.

Funguo ya showCD()

Kama kuchagua kipengele cha chagua cha chagua, programu inafanya:

  1. Kuwanza kipengele cha XMLHTTP kwa kufanya hali ya GetXmlHttpObject
  2. Kuchagua URL inayosaidia kutuma (jina la faili)
  3. Kununua thamani ya URL yenye matokeo ya chagua (q)
  4. Kununua bilii yenye thamani ya nguvu, kwa sababu server inaumia faili ya kachache
  5. Inaanzishwa kama hatua inapofikia, kufanywa kufanya stateChanged
  6. Kufungua kipengele cha XMLHTTP kwa URL yenye kina
  7. Kuwaingia katika mkataba wa server kwa ajili ya hatua ya HTTP

Sayari ya PHP

Sayari hii inaendeshwa na JavaScript, inaandikwa kama faili ya PHP ya kawaida yenye jina lile "getcd.php".

Sayari hii ilinachaguliwa na PHP, inatumia XML DOM kuunza faili ya XML "cd_catalog.xml"。

Uandikia wa kufanya uharibifu wa eneo la XML kwa ajili ya faili ya XML na kuweza kurejea matokeo kwa 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++)
{
//Tengeneza tu maelezo wa elementi
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++)
{ 
//Tengeneza tu maelezo wa elementi
if ($cd->item($i)->nodeType==1)
  { 
  echo($cd->item($i)->nodeName);
  echo(": ");
  echo($cd->item($i)->childNodes->item(0)->nodeValue);
  echo("<br />");
  } 
}
?>

Mifano ya Kueleza

Kutokana na uanzo kutoka JavaScript kwa ukurasa wa PHP, inatokea:

  1. PHP kichwa cha XML DOM kwa faili "cd_catalog.xml"
  2. Kukwisha kuleta maelezo "artist" (nodetypes = 1), kufikiria jina ambalo linapatikana katika data kinachotumika na JavaScript
  3. Kupata kiume sana sana kwenye CD kinachohusiana na kiume kinachotumika kwa JavaScript
  4. Kutuma habari ya album, na kuzikwenda kwa kichupo cha "txtHint"