Databases
StackOverflow2013
Postsdbo
POLooping through XML with jQuery
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POLooping through XML with jQuery
    primarykey
    data
    text
    <p>I've got some basic code that can loop through some XML that's generated from Adobe RoboHelp (for our help documentation). This works fine, but since a topic could be nested as many time as the writer wants, i need a better way to loop through this XML rather than just nesting <code>.each()</code> loops.</p> <p>Here's what the XML looks like</p> <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt; &lt;!--RoboML: Table of Content--&gt; &lt;roboml_toc&gt; &lt;page title="Welcome" url="Welcome.htm"/&gt; &lt;book title="Getting Started" url="Getting_Started/Initial_Setup.htm"&gt; &lt;page title="Initial Setup" url="Getting_Started/Initial_Setup.htm"/&gt; &lt;page title="Customize Settings" url="Getting_Started/Settings.htm"/&gt; &lt;/book&gt; &lt;book title="Administrator Services" url="Administrator_Services/General_Administrator.htm"&gt; &lt;book title="Portal Workspace" url="Administrator_Services/Portal_Workspace/AdminHome.htm"&gt; &lt;page title="Home" url="Administrator_Services/Portal_Workspace/AdminHome.htm"/&gt; &lt;page title="Portal Accounts" url="Administrator_Services/Portal_Workspace/Portal_Accounts.htm"/&gt; &lt;/book&gt; &lt;book title="SpamLab" url="Administrator_Services/SpamLab/SpamLab_Admin_General.htm"&gt; &lt;page title="Alerts" url="Administrator_Services/SpamLab/Alerts.htm"/&gt; &lt;page title="Spam Quarantine" url="Administrator_Services/SpamLab/Admin_Spam_Quarantine_.htm"/&gt; &lt;/book&gt; &lt;/book&gt; &lt;book title="User Services" url="User_Services/General_User.htm"&gt; &lt;book title="Portal Workspace" url="User_Services/Portal_Workspace/Home.htm"&gt; &lt;page title="Home" url="User_Services/Portal_Workspace/Home.htm"/&gt; &lt;page title="Self Help" url="User_Services/Portal_Workspace/Self_Help.htm"/&gt; &lt;/book&gt; &lt;book title="SpamLab" url="User_Services/SpamLab/SpamLab_General.htm"&gt; &lt;page title="Spam Quarantine" url="User_Services/SpamLab/Spam_Quarantine.htm"/&gt; &lt;page title="Virus Quarantine" url="User_Services/SpamLab/Virus_Quarantine.htm"/&gt; &lt;/book&gt; &lt;book title="Encryption" url="User_Services/Encryption/Encryption_General.htm"&gt; &lt;page title="Outlook Plug-in" url="User_Services/Encryption/Encryption_Outlook_Plug_in.htm"/&gt; &lt;/book&gt; &lt;/book&gt; &lt;/roboml_toc&gt; </code></pre> <p>A <code>&lt;page&gt;</code> is an article, and a <code>&lt;book&gt;</code> is a folder.</p> <p>Her's my jQuery code, which only can look one level deep of tags</p> <pre><code> //Get the TOC $tocOutput=""; $.get(tocURL,function(toc){ $(toc).children().each(function(){ $tocOutput+="&lt;li&gt;&lt;a href='"+$(this).attr("url")+"'&gt;"+$(this).attr("title")+"&lt;/a&gt;"; if(this.tagName=="BOOK"){ $tocOutput+="&lt;ul&gt;"; $(this).find("page").each(function(){ $tocOutput+="&lt;li&gt;&lt;a href='"+$(this).attr("url")+"'&gt;"+$(this).attr("title")+"&lt;/a&gt;&lt;/li&gt;"; }); $tocOutput+="&lt;/ul&gt;"; } $tocOutput+="&lt;/li&gt;"; }); $("#list").html($tocOutput); </code></pre> <p>I know there's a better way to just loop through all elements and then determine if the element has children, etc. but I just can't think of how to do it.</p> <p>Any help is greatly appreciated!</p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USdove
    1. USChris Barr
    plurals
    1. This table or related slice is empty.
    1. PL
      singulars
      1. LTLinked
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    3. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POLooping through XML with jQuery
      1. This table or related slice is empty.
      1. VTUpMod
    2. VO
      singulars
      1. POLooping through XML with jQuery
      1. USJarrod Dixon
      1. VTFavorite
    3. VO
      singulars
      1. POLooping through XML with jQuery
      1. This table or related slice is empty.
      1. VTUpMod
    1. COJust curious - why must this be done on the client? Why not apply an XSLT transformation on the server and send down the html? Is the xml dynamic? Could the transformed html not be cached on the server?
      singulars
      1. POLooping through XML with jQuery
      1. USJarrod Dixon
    2. CORegardless, glad you found a solution - NOW ACCEPT KEITH'S ANSWER :)
      singulars
      1. POLooping through XML with jQuery
      1. USJarrod Dixon
    3. COI REFUSE! This was just a proof of concept for now.... actually I just wanted to impress some people. They are showering me with praise now, so it's worth it. Eventually I think we will be doing this server side though.
      singulars
      1. POLooping through XML with jQuery
      1. USChris Barr
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload