Solved

NavBar Expand/Collapse values from an XML file

Posted on 2004-04-15
5
681 Views
Last Modified: 2010-05-18
Here's a previous excepted answer:
http://www.experts-exchange.com/Web/Web_Languages/XML/Q_20952554.html

The problem:
I'd like to expand/collapse the values to one more row.
0
Comment
Question by:evvsupport
  • 3
5 Comments
 
LVL 5

Expert Comment

by:alambres
ID: 10834364
do you mean?

in example

Artist
     Title
         Song
         Song
         ...
0
 
LVL 3

Expert Comment

by:ljfernandez
ID: 10835294
OK, this goes down another level, artist, title then year:

--Lisa

=================================
XML
=================================
<?xml version="1.0" encoding="ISO-8859-1"?>
<?xml-stylesheet type="text/xsl" href="xsl1.xsl"?>
<catalog>
     <artist>
          <name>Bob Dylan</name>
          <albums>
               <album>
                    <title>Empire Burlesque</title>
                    <year>1985</year>
               </album>
               <album>
                    <title>Desire</title>
                    <year>1975</year>
               </album>
          </albums>
     </artist>
     <artist>
          <name>Led Zeppelin</name>
          <albums>
               <album>
                    <title>Hoses of the Holy</title>
                    <year>1973</year>
               </album>
               <album>
                    <title>Physical graffiti</title>
                    <year>1975</year>
               </album>
          </albums>
     </artist>
</catalog>
=================================
XML
=================================

=================================
XSL
=================================
<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" indent="yes" omit-xml-declaration="yes" encoding="ISO-8859-1" />

<xsl:template match="/">
 
  <html>
  <head>
  <title>Catalog</title>
  <script type="text/javascript">
       function showHideAlbums (obj)
       {
            var disp = obj.getAttribute("displayed")=="1"?"none":"block";
            obj.setAttribute("displayed", obj.getAttribute("displayed")=="1"?"0":"1");
            document.getElementById("list"+obj.getAttribute("ind")).style.display = disp;
       }
         function showHideYears (obj)
       {
            var disp = obj.getAttribute("displayed")=="1"?"none":"block";
            obj.setAttribute("displayed", obj.getAttribute("displayed")=="1"?"0":"1");
            document.getElementById("listy"+obj.getAttribute("ind")).style.display = disp;
       }
  </script>
  </head>
  <body>
    <table border="0" cellpadding="0" cellspacing="0">
    <tr>
      <th align="left">Catalog</th>
    </tr>
    <xsl:for-each select="catalog/artist">
         <xsl:variable name="ind"><xsl:value-of select="position()"/></xsl:variable>
          <tr>
                <td>
                     <a href="javascript:void(0);" displayed="0">
                          <xsl:attribute name="ind"><xsl:value-of select="$ind"/></xsl:attribute>
                          <xsl:attribute name="onclick">showHideAlbums (this);</xsl:attribute>
                          <xsl:value-of select="name"/>
                     </a>
                </td>
         </tr>
         <tr>
                <td>
                   <span style="display:none;">
                        <xsl:attribute name="id">list<xsl:value-of select="$ind"/></xsl:attribute>
                        <table>
                             <xsl:for-each select="albums/album">
                             <tr>
                                  <td style="padding-left:30px">
                                                               <a href="javascript:void(0);" displayed="0">
                                                                    <xsl:attribute name="ind"><xsl:value-of select="$ind"/></xsl:attribute>
                                                                    <xsl:attribute name="onclick">showHideYears (this);</xsl:attribute>
                                                                     <xsl:value-of select="title"/>
                                                             </a>
                                                              <span style="display:none;">
                                                                        <xsl:attribute name="id">listy<xsl:value-of select="$ind"/></xsl:attribute>
                                                                        <table>
                                                                               <tr>
                                                                                      <td style="padding-left:30px">
                                                                                                <xsl:value-of select="year"/>
                                                                                          </td>
                                                                               </tr>
                                                                        </table>
                                                               </span>
                                    </td>
                             </tr>
                             </xsl:for-each>
                        </table>
                   </span>
              </td>
         </tr>
    </xsl:for-each>
    </table>
  </body>
  </html>

</xsl:template>

</xsl:stylesheet>
=================================
XSL
=================================
0
 
LVL 3

Expert Comment

by:ljfernandez
ID: 10835808
sorry the above has a bug. Will post update shortly.
0
 
LVL 3

Accepted Solution

by:
ljfernandez earned 500 total points
ID: 10835878
OK the below xsl works correctly.

=================================
XSL
=================================
<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" indent="yes" omit-xml-declaration="yes" encoding="ISO-8859-1" />

<xsl:template match="/">
 
  <html>
  <head>
  <title>Catalog</title>
  <script type="text/javascript">
       function showHideAlbums (obj)
       {
            var disp = obj.getAttribute("displayed")=="1"?"none":"block";
            obj.setAttribute("displayed", obj.getAttribute("displayed")=="1"?"0":"1");
            document.getElementById("list"+obj.getAttribute("ind")).style.display = disp;
       }
         function showHideYears (obj)
       {  
            var disp = obj.getAttribute("displayed")=="1"?"none":"block";
            obj.setAttribute("displayed", obj.getAttribute("displayed")=="1"?"0":"1");
            document.getElementById("listy"+obj.getAttribute("ind")).style.display = disp;
       }
  </script>
  </head>
  <body>
    <table border="0" cellpadding="0" cellspacing="0">
    <tr>
      <th align="left">Catalog</th>
    </tr>
    <xsl:for-each select="catalog/artist">
         <xsl:variable name="ind"><xsl:value-of select="position()"/></xsl:variable>
          <tr>
                <td>
                     <a href="javascript:void(0);" displayed="0">
                          <xsl:attribute name="ind"><xsl:value-of select="$ind"/></xsl:attribute>
                          <xsl:attribute name="onclick">showHideAlbums (this);</xsl:attribute>
                          <xsl:value-of select="name"/>
                     </a>
                </td>
         </tr>
         <tr>
                <td>
                   <span style="display:none;">
                        <xsl:attribute name="id">list<xsl:value-of select="$ind"/></xsl:attribute>
                        <table>
                             <xsl:for-each select="albums/album">      
                             <tr>
                                  <td style="padding-left:30px">
                                                               <a href="javascript:void(0);" displayed="0">
                                                                    <xsl:attribute name="ind"><xsl:value-of select="title"/></xsl:attribute>
                                                                    <xsl:attribute name="onclick">showHideYears (this);</xsl:attribute>
                                                                     <xsl:value-of select="title"/>
                                                             </a>
                                                              <span style="display:none;">
                                                                        <xsl:attribute name="id">listy<xsl:value-of select="title"/></xsl:attribute>
                                                                        <table>
                                                                               <tr>
                                                                                      <td style="padding-left:30px">
                                                                                                <xsl:value-of select="year"/>
                                                                                          </td>
                                                                               </tr>
                                                                        </table>
                                                               </span>
                                    </td>
                             </tr>
                             </xsl:for-each>
                        </table>
                   </span>
              </td>
         </tr>
    </xsl:for-each>
    </table>
  </body>
  </html>

</xsl:template>

</xsl:stylesheet>


=================================
XSL
=================================
0
 

Author Comment

by:evvsupport
ID: 10835912
Awesome.. Thanks!
0

Featured Post

Highfive Gives IT Their Time Back

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

Join & Write a Comment

The Client Need Led Us to RSS I recently had an investment company ask me how they might notify their constituents about their newsworthy publications.  Probably you would think "Facebook" or "Twitter" but this is an interesting client.  Their cons…
Introduction In my previous article (http://www.experts-exchange.com/Microsoft/Development/MS-SQL-Server/SSIS/A_9150-Loading-XML-Using-SSIS.html) I showed you how the XML Source component can be used to load XML files into a SQL Server database, us…
In this seventh video of the Xpdf series, we discuss and demonstrate the PDFfonts utility, which lists all the fonts used in a PDF file. It does this via a command line interface, making it suitable for use in programs, scripts, batch files — any pl…
Illustrator's Shape Builder tool will let you combine shapes visually and interactively. This video shows the Mac version, but the tool works the same way in Windows. To follow along with this video, you can draw your own shapes or download the file…

760 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

20 Experts available now in Live!

Get 1:1 Help Now