Javascript: Not reading XML correctly.

[~J~]

One of them days today

Can someone show why the following XML:

<?xml version="1.0" encoding="us-ascii" ?>
 <node text="Top" parentID="0">
  <node text="Spirits" parentID="" tag="1">
   <node text="Brandy" parentID="1" tag="B">
    <node text="Cognac / Armagnac" parentID="B" tag="10">
     <node text="Cognac" parentID="10" tag="23" />
     <node text="Armagnac" parentID="10" tag="8" />
    </node>
    <node text="Other Brandy" parentID="B" tag="19">
     <node text="Grape Brandy" parentID="19" tag="162">
      <node text="Other Grape Brandy" parentID="162" tag="125" />
     </node>
     <node text="Grape EDV" parentID="19" tag="164">
      <node text="Fine (EDV)" parentID="164" tag="92" />
      <node text="Grappa" parentID="164" tag="34" />
      <node text="Singani" parentID="164" tag="105" />
      <node text="Pisco" parentID="164" tag="102" />
      <node text="Marc / Lie" parentID="164" tag="100" />
     </node>
    </node>
   </node>
  </node>
 </node>

Doesn't render correctly please.

I'm running this code which seems to 'pop-up' all over the place for traversing XML files.

 function loadXML(xmlFile)
 {
  xmlDoc.async="false";
  xmlDoc.onreadystatechange=verify;
  xmlDoc.load(xmlFile);
 }
 function verify()
 { 
  if(xmlDoc.readyState!=4)
   return false; 
 }
function traverse(tree) {
        if(tree.hasChildNodes()) {
                document.write('<ul><li>');
                document.write('<b>'+tree.tagName+' : </b>');
                var nodes=tree.childNodes.length;
                for(var i=0; i<tree.childNodes.length; i++)
                        traverse(tree.childNodes(i));
                document.write('</li></ul>');
        }
        else
                document.write(tree.text);
}
 
 function initTraverse(file)
  {
  loadXML(file);
  var doc=xmlDoc.documentElement;
  traverse(doc);
 }

(Yes I know I'm not getting the attribute "text", I can cover that later, but it's still not rendering the correct child nodes, as if it's omitting the last one per child)

Totally stumped.

 

[Ladforce]

From the guide this was taken from I notice theres a line

var xmlDoc=new ActiveXObject("Microsoft.XMLDOM");

do you have this at the top of your script? Also, this is a Microsoft only function call so will only work in IE. What does "pop up" mean? Any errors/warnings in the debugging console?

 

[~J~]

Yeah got that, actually have the following:

 var xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
 
 initTraverse("test.xml");

"for now" the IE thing isn't a problem as my testing is in IE, however would be interested to know of any cross-platform methods.

 

[~J~]

OK still having issues with this so going to look at it from a different angle.

Can someone recommend a good tutorial that will:

Allow me to traverse an XML document with children
Cross Platform
Ideally NOT using the Microsoft XMLDOM ActiveX component.

TIA.

 

[Ladforce]

Did you check the error console for problems when running this? Also, what does "pop-up" mean? Can you post a screenshot or something so we know what the problem is.

 

[AJK]

Tried using jQuery?

Many links out there, here's a quickly googled one:
http://think2loud.com/reading-xml-with-jquery/

 

[Ladforce]

Had a few free mins so rewrote the parser. Seems to work ok on my system using an xml string. Your document should parse ok. Code can prob be neatened up a bit if your worried about it

function traverse(tree)
{
    txt = "";
    attrs = tree.attributes

    if(attrs != null)
    {
        txt = attrs.getNamedItem("text").value
        document.write('<ul><li>');
    }

    if(tree.childNodes.length > 0)
    {
        if(txt != "")
            document.write('<b>'+txt+' : </b>');

        for(var i=0; i<tree.childNodes.length; i++)
        {
           traverse(tree.childNodes[i]);
        }
        document.write('</li></ul>');
    }
    else
    {
        if(txt != "")
            document.write(txt+'</li></ul>');
    }
}

 

[SimonCHere]

Darn beaten to it but using your original traversing code:

The problem seemed to be the random use of the <ul> tags.

function traverse(tree) {
     document.write('<ul>');
        if(tree.hasChildNodes()) 
		{
            
                document.write('<b>'+ tree.getAttribute("text") +' : </b>');
                var nodes=tree.childNodes.length;
                for(var i=0; i<tree.childNodes.length; i++)
				{
                        traverse(tree.childNodes(i));
						if (tree.childNodes(i).hasChildNodes()){
							document.write('</ul>');
						}
				}
        }
        else
		{
               document.write('<li>'+ tree.getAttribute("text") + '</li>');
			   document.write('</ul>');
		}
}

 

[Ladforce]

Darn beaten to it but using your original traversing code:

The problem seemed to be the random use of the <ul> tags.

function traverse(tree) {
     document.write('<ul>');
        if(tree.hasChildNodes()) 
		{
            
                document.write('<b>'+ tree.getAttribute("text") +' : </b>');
                var nodes=tree.childNodes.length;
                for(var i=0; i<tree.childNodes.length; i++)
				{
                        traverse(tree.childNodes(i));
						if (tree.childNodes(i).hasChildNodes()){
							document.write('</ul>');
						}
				}
        }
        else
		{
               document.write('<li>'+ tree.getAttribute("text") + '</li>');
			   document.write('</ul>');
		}
}

That still has problems. childNodes is an array not a function therefore () cant be used. Also, hasChildNodes is not valid for all the objects we will come across in traverse, you have to use childNodes.length.

 

[SimonCHere]

That is of course true, but for this XML it does work.

() appears to work in IE. it should have been [] though.

 

[Ladforce]

edit - ignore, I was testing passing the dom document rather than the documentElement I would rather use childNodes.length though unless a check is added to make sure any object passed to traverse is an element object and has the hasChildNodes method.