I want to use ajax, by selected the option box, retrieve data from a .xml file and fill in to the textbox.
below is the html page
below is the .js file
below is the .php page
But it not works...please help...thanks.. thanks.
below is the html page
Code:
<script src="selectcd.js"></script> <form> Select a CD: <select name="cds" onchange="showCD(this.value)"> <option value="Bob">Bob</option> <option value="Bonnie">Bonnie</option> </select> </form><p> <input type="text" name="txtSingerName" id="txtSingerName" size=20 class="stdbox" value="<?php print stripslashes($form_txtSingerName); ?>"> <input type="text" name="txtAlbumName" id="txtAlbumName" size=20 class="stdbox" value="<?php print stripslashes($form_txtAlbumName); ?>"> </p>
Code:
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("txtSingerName").value=xmlHttp.responseText
document.getElementById("txtAlbumName").value=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;
}
Code:
<?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);
}
}
?>
Comment