How_To_XML_Display_Nested_XML

[Home] [Edit this page] [Recent Changes] [Special Pages] [Help]

How_To_XML_Display_Nested_XML_XSLT

How to display nested elements in an HTML table using XSLT?

An XML document can be thought of as a database containing records. In the example, the <book> element is the table that holds the child elements that have fields such as <title> or <location>.

Nested elements mean that child elements can contain further child elements themselves such as the <location> element has the <department> and <room> child elements in the example.

Create the XML document and link it to the XSL stylesheet.

<?xml version="1.0"?>
<?xml-stylesheet type="text/xsl" href="books05.xsl"?>
<books>
  <book>
    <title>OpenGL Programming Guide Fourth Edition</title>	
    <location>
	<department>Development</department>
	<room>107</room>
    </location>
    <publisher>Addison-Wesley</publisher>
    <year>2004</year>
  </book>
  <book>
     <title>Curves and Surfaces for CAGD: A Practical Guide</title>
     <location>
	<department>Development</department>
	<room>116</room>
     </location>
     <publisher>Academic Press</publisher>
     <year>2002</year>
  </book>
  <book>
     <title>An Introduction to NURBS: With Historical Perspective</title>
     <location>
	<department>Development</department>
	<room>120</room>
     </location>
     <publisher>Academic Press</publisher>
     <year>2001</year>
  </book>
  <book>
     <title>NURBS: From Projective Geometry to Practical Use</title>
     <location>
	<department>Development</department>
	<room>126</room>
     </location>
     <publisher>A K Peters</publisher>
     <year>1999</year>
  </book>
</books>

Create the XSL stylesheet.

<?xml version="1.0"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" encoding="UTF-8"/>
<xsl:template match="/">
<html>
<head><title>Books</title>
</head>
<body>
<table width="100%" border="1">
  <THEAD>
    <TR>
       <TD width="35%"><B>Title</B></TD>
       <TD width="15%"><B>Location</B></TD>
       <TD width="10%"><B>Publisher</B></TD>
       <TD width="10%"><B>Year</B></TD>
    </TR>
  </THEAD> 
  <TBODY>
   <xsl:for-each select="books/book">
    <TR>	
       <TD width="35%"><xsl:value-of select="title" /></TD>  	
       <TD width="15%"><xsl:apply-templates select="location" /></TD> 
       <TD width="10%"><xsl:value-of select="publisher" /></TD>
       <TD width="10%"><xsl:value-of select="year" /></TD>
    </TR>
   </xsl:for-each>
  </TBODY>
</table>
</body>
</html>
</xsl:template>
<xsl:template match="location">
<xsl:value-of select="department" /> <xsl:value-of select="room" />
</xsl:template>
</xsl:stylesheet>

To bind XML elements to the HTML table, the <xsl:for-each> XSL template must appear before the table row tag to make sure that a new row is created for each <book> element.

To bind nested XML elements to the HTML table, use <xsl:apply-templates> that creates a new template to process further elements that start from the element specified.

The <xsl:value-of> template will output each selected child elements' text in a separate table cell.

XML FAQ

last edited (April 19, 2004) by lillu, Number of views: 2630, Current Rev: 4 (Diff)

[Edit this page] [Page history] [What links here] [Discuss this topic] [Printer Friendly]