CodingForums.com - Working with xml and Javascript in HTML form

CodingForums.com (http://www.codingforums.com/index.php)

- XML (http://www.codingforums.com/forumdisplay.php?f=3)

- - Working with xml and Javascript in HTML form (http://www.codingforums.com/showthread.php?t=289552)

Working with xml and Javascript in HTML form

Hi

I have searched high and low to get some real examples of this, but no luck.
What I need to do is input a name into an input box and search the xml file (which has three different elements eg. customers root element, person/first and last. Address/street/city/state/postcode/country and Phone) to match that name. (I don't know what to do if there is more than one person with that same name).
When the match is correct then I need to bring through the rest of the relevant info belong to that person. At the moment the xml file is is working fine and coming up into a table. But now it needs the html file. I have tried many different examples of html files but cannot get it to bring through any data. Thanks in anticipation

[CODE]

<?xml version="1.0" standalone="no"?>
<?xml-stylesheet type="text/xsl" href="applyt.xsl" ?>
<customers
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:noNamespaceSchemaLocation="applydtd.dtd">

<person>
<name>
<first>John</first>
<last>Smith</last>
</name>
<address>
<street>123 Oak St</street>
<city>PERTH</city>
<state>WA</state>
<postcode>4372</postcode>
<country>Australia</country>
<email>js@info.com.au</email>
</address>
<phone>0754641323</phone>
</person>
<person>
<name>
<first>Zack</first>
<last>Zwyker</last>
</name>
<address>
<street>368 Elm St</street>
<city>SYDNEY</city>
<state>NSW</state>
<postcode>2000</postcode>
<country>Australia</country>
<email>zz@info.com.au</email>
</address>
<phone>0478964234</phone>
</person>
<person>
<name>
<first>Albert</first>
<last>Aikens</last>
</name>
<address>
<street>368 Cedar St</street>
<city>BRISBANE</city>
<state>QLD</state>
<postcode>7145</postcode>
<country>Australia</country>
<email>aa$info.com.au</email>

</address>
<phone>0256897426></phone>
</person>
<person>
<name>
<first>Michael</first>
<last>Jones</last>
</name>
<address>
<street>15 Cherry St</street>
<city>SYDNEY</city>
<state>NSW</state>
<postcode>2000</postcode>
<country>Australia</country>
<email>jj@info.com.au</email>
</address>
<phone>0297684321</phone>
</person>
</customers>

[CODE]

To put your code into the CODE tags use the hash mark (#) located in the tool bar above the Message box.

Your xml show nicely because it uses a style sheet named applyt.xsl.

I saved your xml file as customers.xml since you did not tell us a name for it. The following is html to display what you wanted. BUT you have to know the name. I could add js to show all the names or you could try it as an exercise.

Code:

<!DOCTYPE html>   <!-- Zack Zwyker    zack zwyker   -->

<html>

<body>

<input type="text" onblur="display(this.value);">



<script>

function loadXMLDoc(dname)

{

if (window.XMLHttpRequest)

  {

  xhttp=new XMLHttpRequest();

  }

else

  {

  xhttp=new ActiveXObject("Microsoft.XMLHTTP");

  }

xhttp.open("GET",dname,false);

xhttp.send("");

return xhttp.responseXML;

}



function display(Aname){

xml=loadXMLDoc("customers.xml");

path="/customers/person/name"



x=xml.getElementsByTagName("first")[0].childNodes[0];

        for(z=0; z<x.length; z++){

                x=xml.getElementsByTagName("first")[z].childNodes[0];

                y=xml.getElementsByTagName("last")[z].childNodes[0];

                TheName = x.nodeValue+" "+y.nodeValue;

                if(TheName.toLowerCase() == Aname.toLowerCase()){

                        document.write(x.nodeValue+" "+y.nodeValue+"<br />");

                        document.write(xml.getElementsByTagName("street")[z].childNodes[0].nodeValue+"<br />");

                        document.write(xml.getElementsByTagName("city")[z].childNodes[0].nodeValue+"<br />");

                        document.write(xml.getElementsByTagName("state")[z].childNodes[0].nodeValue+"<br />");

                        document.write(xml.getElementsByTagName("postcode")[z].childNodes[0].nodeValue+"<br />");

                        document.write(xml.getElementsByTagName("country")[z].childNodes[0].nodeValue+"<br />");

                        document.write(xml.getElementsByTagName("email")[z].childNodes[0].nodeValue+"<br />");

                }

        }

}

</script>

</body>

</html>