Using xpath to produce and display parent and its child?

HTML

      <div id="nav"></div>
       <ul>
         <li><span id="parent" >main</span></li>
         <li><span id="chapter">chapter</span></li>
         <li><span id="subchapter">subchapter</span></li>
       </ul>
       <div id="result"> 
        
      </div>

Open in new window

XML:

<section id="parent">
    	<data>main</data>
    	<chapter id="chapter">
    		<data>Chapter 1</data>
    		<subchapter id="subchapter">
    			<data>Subchapter 1.1</data>
    			<topic id="634322">
    				<data>Topic A</data>
    				<paragraph id="2373" level="1">example1</paragraph>
    				<paragraph id="3438" level="2">example2.</paragraph>
    				<paragraph id="4549" level="1">exampl3</paragraph>
    			</topic>
                   </subchapter>
               ....
    	</chapter>
         ...
    </section>
    ....

Open in new window

Using Xpath and javascript or jquery to produce (id of nav map to id of xml):

on click `id=parent` or `chapter` or `subchapter` get and display:

       main
         chapter
           Subchapter 1.1
             Topic A
               example1
                 example2
               exampl3

Open in new window

main
chapter
Subchapter 1.1
Topic A
example1
example2
exampl3

How can I get this the above result using xpath then display result on `<div id="result">`

thanks

pelnisgproup

Asked: 2013-11-03

Advertise Here

AJAX
XML

1 Solution

LVL 31

Alexandre SimõesManager / Technology SpecialistCommented: 2013-11-04

So you're making an ajax call on each node expansion to get it's children is that?
In response you get XML and want to parse it so that you'll be able to inject the new nodes under the parent... correct?

My first question is: Can't you return json instead of XML?
Dealing with XML in javascript is slow and a mess...
http://www.w3schools.com/xml/xml_parser.asp

Basically you can parse your response xml string like:

var txt = '-> XML String goes here <-';
var xmlDoc;
if (window.DOMParser)
  {
  var parser=new DOMParser();
  xmlDoc=parser.parseFromString(txt,"text/xml");
  }
else // Internet Explorer
  {
  xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
  xmlDoc.async=false;
  xmlDoc.loadXML(txt);
  }

Open in new window

after this, xmlDoc will contain the structure of your XML data and you can access it normally with the dot notation.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Expand your skills with this month's free Premium course.

Using xpath to produce and display parent and its child?

Join & Write a Comment Already a member? Login.

Featured Post