How to display nested elements in a HTML table using XSLT?
Create the XML document.
<?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 a HTML table the <for-each> XSL template must appear before the table row tags. This ensures that a new row is created for each of the <book> elements.
To bind nested XML elements to a HTML table, use <apply-templates>, this creates a new template to process further elements starting from the element specified.
The <value-of> template will output the text from the selected child elements’ in to a separate table.