Ajax and using responseXML

Posted by Banderdash on Stack Overflow See other posts from Stack Overflow or by Banderdash
Published on 2010-05-04T05:37:10Z Indexed on 2010/05/04 5:48 UTC
Read the original article Hit count: 305

Filed under:
|
|

Hello,

I have a XML file that looks like this:

<response>
  <library name="My Library">
    <book id="1" checked-out="1">
      <authors>
        <author>David Flanagan</author>
      </authors>
      <title>JavaScript: The Definitive Guide</title>
      <isbn-10>0596101996</isbn-10>
    </book>
    <book id="2" checked-out="1">
      <authors>
        <author>John Resig</author>
      </authors>
      <title>Pro JavaScript Techniques (Pro)</title>
      <isbn-10>1590597273</isbn-10>
    </book>
    <book id="3" checked-out="0">
      <authors>
        <author>Erich Gamma</author>
        <author>Richard Helm</author>
        <author>Ralph Johnson</author>
        <author>John M. Vlissides</author>
      </authors>
      <title>Design Patterns: Elements of Reusable Object-Oriented Software</title>
      <isbn-10>0201633612</isbn-10>
    </book>
  ...
  </library>
</response>

I'm using a simple JS script to, on click show all the titles of the books:

<script type="text/javascript">
function loadXMLDoc()
{
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    xmlDoc=xmlhttp.responseXML;
    var txt="";
    x=xmlDoc.getElementsByTagName("title");
    for (i=0;i<x.length;i++)
      {
      txt=txt + x[i].childNodes[0].nodeValue + "<br />";
      }
    document.getElementById("checkedIn").innerHTML=txt;
    }
  }
xmlhttp.open("GET","ajax-response-data.xml",true);
xmlhttp.send();
}
</script>

This works fine, as you can see here: http://clients.pixelbleed.net/ajax-test/

What I'd like to do is have the results post, on page load (not on click) into two separate DIV's depending on checked-out variable in the XML. So <book id="#" checked-out="1"> would post to the checkedIn div, <book id="#" checked-out="0"> posts to a checkedOut div. Also want to display the title and the author--would love any ideas as best method for accomplishing this.

Apologize in advanced for the newbieness of my query.

© Stack Overflow or respective owner

Related posts about AJAX

Related posts about JavaScript