XSLT Sample: Breakfast Menu
The Breakfast Menu sample demonstrates XML data islands and includes the following files.
To test the sample, copy the files to a folder on your local drive. Then do one of the following (beginners might want to try all three methods):
- Open simple.xml using Internet Explorer by double clicking the file from Explorer.
- Open simple-islands.htm using Internet Explorer by double clicking the file from Explorer.
- Open simple.asp page by using Internet Explorer with a URL such as "http://localhost/breakfast/simple.asp".
The last option assumes that IIS is running on your machine and that you have created a breakfast virtual directory and placed all the files in it.
HTML File (simple-islands.htm)
<HTML> <HEAD> <TITLE>Simple demo of Microsoft XSL Processor</TITLE> </HEAD> <XML id="source" src="simple.xml"></XML> <XML id="style" src="simple.xsl"></XML> <SCRIPT FOR="window" EVENT="onload"> xslTarget.innerHTML = source.transformNode(style.XMLDocument); </SCRIPT> <BODY> <P STYLE="font-size:10pt; font-family:Verdana; color:gray"> <B>This demo shows the use of data islands for loading XML source and XSLT style sheets, and for inserting the transformed result into the Web page.</B> </P> <DIV id="xslTarget"></DIV> </BODY> </HTML>
<?xml version='1.0'?> <?xml:stylesheet type="text/xsl" href="simple.xsl" ?> <breakfast-menu> <food> <name>Belgian Waffles</name> <price>$5.95</price> <description>Two of our famous Belgian Waffles with plenty of real maple syrup.</description> <calories>650</calories> </food> <food> <name>Strawberry Belgian Waffles</name> <price>$7.95</price> <description>Light Belgian waffles covered with strawberries and whipped cream.</description> <calories>900</calories> </food> <food> <name>Berry-Berry Belgian Waffles</name> <price>$8.95</price> <description>Light Belgian waffles covered with an assortment of fresh berries and whipped cream.</description> <calories>900</calories> </food> <food> <name>French Toast</name> <price>$4.50</price> <description>Thick slices made from our homemade sourdough bread.</description> <calories>600</calories> </food> <food> <name>Homestyle Breakfast</name> <price>$6.95</price> <description>Two eggs, bacon or sausage, toast, and our ever-popular hash browns.</description> <calories>950</calories> </food> </breakfast-menu>
<?xml version="1.0"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="/"> <HTML> <BODY STYLE="font-family:Arial, helvetica, sans-serif; font-size:12pt; background-color:#EEEEEE"> <xsl:for-each select="breakfast-menu/food"> <DIV STYLE="background-color:teal; color:white; padding:4px"> <SPAN STYLE="font-weight:bold; color:white"><xsl:value-of select="name"/></SPAN> - <xsl:value-of select="price"/> </DIV> <DIV STYLE="margin-left:20px; margin-bottom:1em; font-size:10pt"> <xsl:value-of select="description"/> <SPAN STYLE="font-style:italic"> (<xsl:value-of select="calories"/> calories per serving) </SPAN> </DIV> </xsl:for-each> </BODY> </HTML> </xsl:template> </xsl:stylesheet>
<%@ LANGUAGE = JScript %> <% // Set the source and style sheet locations here. var sourceFile = Server.MapPath("simple.xml"); var styleFile = Server.MapPath("simple.xsl"); // Load the XML. var source = Server.CreateObject("Msxml2.DOMDocument.5.0"); source.async = false; source.load(sourceFile); // Load the XSLT. var style = Server.CreateObject("Msxml2.DOMDocument.5.0"); style.async = false; style.load(styleFile); Response.Write(source.transformNode(style)); %>