Stonebroom.XSLTransform Example

Stonebroom.XSLTransform Example

These pages demonstrate what the XSLTransform component can do. In them, we use a simple XML document and transform it to an HTML page using an XSL file. You can view the contents of these files and the results within these pages, or you can access the original XML file and have the equivalent transformation take place on your browser. However this last option will only work if you are using Internet Explorer version 5.0 or higher.

The XML file contents are:
<?xml version="1.0" ?> <?xml-stylesheet type="text/xsl" href="booklist.xsl"?> <BOOKLIST> <BOOKINFO> <ISBN>1-861000-68-5</ISBN> <BOOK_TITLE>IE4 DHTML Programmer's Reference</BOOK_TITLE> <RELEASE_DATE>1997-09-01</RELEASE_DATE> <DESCRIPTION>The ideal intro to Dynamic HTML</DESCRIPTION> <BOOK_CODE>0685</BOOK_CODE> </BOOKINFO> <BOOKINFO> <ISBN>1-861000-70-7</ISBN> <BOOK_TITLE>Professional IE4 Programming</BOOK_TITLE> <RELEASE_DATE>1997-10-01</RELEASE_DATE> <DESCRIPTION>Advanced IE4 programming methods</DESCRIPTION> <BOOK_CODE>0707</BOOK_CODE> </BOOKINFO> <BOOKINFO> <ISBN>1-861001-19-3</ISBN> <BOOK_TITLE>Netscape DHTML Programmer's Reference</BOOK_TITLE> <RELEASE_DATE>1997-08-01</RELEASE_DATE> <DESCRIPTION>Navigator can do Dynamic HTML too</DESCRIPTION> <BOOK_CODE>1193</BOOK_CODE> </BOOKINFO> <BOOKINFO> <ISBN>1-861001-26-6</ISBN> <BOOK_TITLE>Professional Active Server Pages 2.0</BOOK_TITLE> <RELEASE_DATE>1998-03-27</RELEASE_DATE> <DESCRIPTION>ASP 2.0 gets the Wrox treatment</DESCRIPTION> <BOOK_CODE>1266</BOOK_CODE> </BOOKINFO> </BOOKLIST>

The XSL style sheet contents are:
<xsl:stylesheet xmlns:xsl="http://www.w3.org/TR/WD-xsl"> <xsl:template match="/"> <HTML> <HEAD> <TITLE>A List of Books</TITLE> <STYLE TYPE="text/css"> BODY TD {font-family:Tahoma,Arial,sans-serif; font-size:10pt; font-weight:normal} .heading {font-family:Tahoma,Arial,sans-serif; font-size:14pt; font-weight:bold} .itemhead {font-family:Tahoma,Arial,sans-serif; font-size:10pt; font-weight:bold} </STYLE> </HEAD> <BODY> <DIV CLASS="heading"> <IMG SRC="images/books.gif" ALIGN="BOTTOM" HSPACE="10" /> A List of Books </DIV><HR /> <xsl:for-each select="//BOOKINFO" order-by="-RELEASE_DATE"> <TABLE><TR><TD> <xsl:apply-templates select="BOOK_CODE" /> </TD><TD VALIGN="top"> <xsl:apply-templates select="BOOK_TITLE" /> <xsl:apply-templates select="ISBN" /> <xsl:apply-templates select="RELEASE_DATE" /> <xsl:apply-templates select="DESCRIPTION" /> </TD></TR></TABLE><P /> </xsl:for-each> <HR /> <FORM ACTION="xtexamp.htm"> <INPUT TYPE="submit" VALUE="Back" /> </FORM> </BODY> </HTML> </xsl:template> <xsl:template match="ISBN"> <IMG SRC="images/ball_red.gif" ALIGN="MIDDLE" HSPACE="5"/> ISBN: <xsl:value-of /><BR /> </xsl:template> <xsl:template match="RELEASE_DATE"> <IMG SRC="images/ball_red.gif" ALIGN="MIDDLE" HSPACE="5"/> Released: <xsl:value-of /><BR /> </xsl:template> <xsl:template match="BOOK_CODE"> <IMG HSPACE="15" BORDER="0"> <xsl:attribute name="SRC"> images/<xsl:value-of />.gif </xsl:attribute> </IMG> </xsl:template> <xsl:template match="DESCRIPTION"> <P><xsl:value-of /></P> </xsl:template> <xsl:template match="BOOK_TITLE"> <P><B><xsl:value-of /></B></P> </xsl:template> </xsl:stylesheet>

You can use these files in two ways:

View the result of the transformation.
This is what would be returned by the component as a string, or
written to a file on disk (depending on the parameter values).

Open the XML document in your browser.
Note that this will only produce the transformation if you are using
Internet Explorer version 5.0 or higher.

To see the results, and the difference between the original XML
document and the transformed one, view the source of the page
when it is displayed in your browser.