WebReference.com - Chapter 7 of XML for ASP.NET Developers, from Sams Publishing (5/13)

[previous] [next]

XML for ASP.NET Developers

Transforming to HTML Using XSLT Elements

One of the best ways to learn about the different XSLT elements is to see them in action. Listing 7.4 repeats the XSLT style sheet shown earlier in Listing 7.2 but adds additional functionality. After looking through the code, you'll see a step-by-step explanation of what the code is doing.

Listing 7.4 Golfers XSLT Document

 1: <?xml version="1.0"?>
 2: <xsl:stylesheet xmlns:xsl="https://www.w3.org/1999/XSL/Transform"
 3:  version="1.0">
 4:   <xsl:output method="html" indent="yes"/>
 5:   <xsl:template match="/">
 6:     <html>
 7:       <head>
 8:         <style type="text/css">
 9:           .blackText {font-family:arial;color:#000000;}
 10:           .largeYellowText {font-family:arial;
 11:                    font-size:18pt;color:#ffff00;}
 12:           .largeBlackText {font-family:arial;
 13:                   font-size:14pt;color:#000000;}
 14:           .borders {border-left:1px solid #000000;
 15:                border-right:1px solid #000000;
 16:                border-top:1px solid #000000;
 17:                border-bottom:1px solid #000000;}
 18:         </style>
 19:       </head>
 20:       <body bgcolor="#ffffff">
 21:         <span class="largeBlackText">
 22:           <b>List of</b>
 23:           <xsl:if test="count(//golfer) > 0">
 24:             &#xa0;
 25:             <xsl:value-of select="count(//golfer)"/>&#xa0;
 26:           </xsl:if>
 27:           <b>Golfers</b>
 28:         </span>
 29:         <p/>
 30:         <xsl:apply-templates/>
 31:       </body>
 32:     </html>
 33:   </xsl:template>
 34:   <xsl:template match="golfers">
 35:     <xsl:apply-templates select="golfer"/>
 36:   </xsl:template>
 37:   <xsl:template match="golfer">
 38:     <table class="borders" border="0" width="640"
 39:      cellpadding="4" cellspacing="0" bgcolor="#efefef">
 40:       <xsl:apply-templates select="name"/>
 41:       <tr class="blackText">
 42:         <td width="12%" align="left">
 43:           <b>Skill: </b>
 44:         </td>
 45:         <td width="12%" align="left">
 46:           <xsl:attribute name="style">
 47:             <xsl:choose>
 48:               <xsl:when test="@skill='excellent'">
 49:                 color:#ff0000;font-weight:bold;
 50:               </xsl:when>
 51:               <xsl:when test="@skill='moderate'">
 52:                 color:#005300;
 53:               </xsl:when>
 54:               <xsl:when test="@skill='poor'">
 55:                 color:#000000;
 56:               </xsl:when>
 57:               <xsl:otherwise>
 58:                 color:#ffffff;
 59:               </xsl:otherwise>
 60:             </xsl:choose>
 61:           </xsl:attribute>
 62:           <xsl:value-of select="@skill"/>
 63:         </td>
 64:         <td width="12%" align="left">
 65:           <b>Handicap: </b>
 66:         </td>
 67:         <td width="12%" align="left">
 68:           <xsl:value-of select="@handicap"/>
 69:         </td>
 70:         <td width="12%" align="left">
 71:           <b>Clubs: </b>
 72:         </td>
 73:         <td width="40%" align="left">
 74:           <xsl:value-of select="@clubs"/>
 75:         </td>
 76:       </tr>
 77:       <tr>
 78:         <td colspan="6">&#xa0;</td>
 79:       </tr>
 80:       <tr class="blackText">
 81:         <td colspan="6" class="largeBlackText">
 82:           Favorite Courses 
 83:         </td>
 84:       </tr>
 85:       <tr>
 86:         <td colspan="2">
 87:           <b>City: </b>
 88:         </td>
 89:         <td colspan="2">
 90:           <b>State: </b>
 91:         </td>
 92:         <td colspan="2">
 93:           <b>Course: </b>
 94:         </td>
 95:       </tr>
 96:       <xsl:apply-templates select="favoriteCourses"/>
 97:     </table>
 98:     <p/>
 99:   </xsl:template>
100:   <xsl:template match="name">
101:     <tr>
102:       <td colspan="6" class="largeYellowText" bgcolor="#02027a">
103:         <xsl:value-of select="firstName"/>&#xa0;
104:         <xsl:value-of select="lastName"/>
105:       </td>
106:     </tr>
107:   </xsl:template>
108:   <xsl:template match="favoriteCourses">
109:     <xsl:apply-templates/>
110:   </xsl:template>
111:   <xsl:template match="course">
112:     <xsl:call-template name="writeComment"/>
113:     <tr class="blackText">
114:       <td colspan="2" align="left">
115:         <xsl:value-of select="@city"/>
116:       </td>
117:       <td colspan="2" align="left">
118:         <xsl:value-of select="@state"/>
119:       </td>
120:       <td colspan="2" align="left">
121:         <xsl:value-of select="@name"/>
122:       </td>
123:     </tr>
124:   </xsl:template>
125:   <xsl:template name="writeComment">
126:     <xsl:comment>List Course Information</xsl:comment>
127:   </xsl:template>
128: </xsl:stylesheet>

The following explanation walks through each element used in Listing 7.4.

Line 1:

 1: <?xml version="1.0"?>

The XML declaration is used because this is a valid XML document.

Lines 23:

 2: <xsl:stylesheet xmlns:xsl="https://www.w3.org/1999/XSL/Transform"
 3:  version="1.0">

This line contains the first XSLT element used in the document: xsl:stylesheet. As shown earlier, this element has an associated namespace declaration and version attribute. The xsl:transform element could also be used here. One of these two elements will always be the root node of the XSLT document.

Line 4:

 4:   <xsl:output method="html" indent="yes"/>

The xsl:output element is used to specify what type of format will be created in the result tree. The method attribute can contain values of xml, html, or text. This element is a top-level element, meaning that it must be a child of the xsl:stylesheet element to be used properly. The different attributes that can be used to describe this element are the following: method, version, encoding, omit-xml-declaration, standalone, doctype-public, doctype-system, cdata-section-elements, indent, media-type. This element includes the indent attribute, which will indent the result tree to show its hierarchical structure. XSLT processors do not have to honor the indentation request. If the processor does support indentation, the manner in which the indentation is implemented is up to the processor.

Lines 533:

 5:   <xsl:template match="/">
 6:     <html>
 7:       <head>
 8:         <style type="text/css">
 9:           .blackText {font-family:arial;color:#000000;}
 10:           .largeYellowText {font-family:arial;
 11:                    font-size:18pt;color:#ffff00;}
 12:           .largeBlackText {font-family:arial;
 13:                   font-size:14pt;color:#000000;}
 14:           .borders {border-left:1px solid #000000;
 15:                border-right:1px solid #000000;
 16:                border-top:1px solid #000000;
 17:                border-bottom:1px solid #000000;}
 18:         </style>
 19:       </head>
 20:       <body bgcolor="#ffffff">
 21:         <span class="largeBlackText">
 22:           <b>List of</b>
 23:           <xsl:if test="count(//golfer) > 0">
 24:             &#xa0;
 25:             <xsl:value-of select="count(//golfer)"/>&#xa0;
 26:           </xsl:if>
 27:           <b>Golfers</b>
 28:         </span>
 29:         <p/>
 30:         <xsl:apply-templates/>
 31:       </body>
 32:     </html>
 33:   </xsl:template>

Here's an example of the first template definition specified in the XSLT document. Templates contain structured information that will be processed and output to the result tree. They are processed when the XPath pattern found in the match attribute matches a node found in the source XML document.

This template has a match attribute with a value of /. The value (/) represents a pattern that matches the XML document (think of it as the position directly above the root XML element). The purpose of a pattern is to identify which nodes a template applies to. You can think of patterns as valid XPath statements, although the XSLT definition does define them separately.

If the pattern specified in the match attribute matches a node in the source XML document, the information located within the template will be processed and written out to the result tree. In this case, when the XML document is matched, the basic elements used to start an HTML document are added to the result tree.

Note
It's worth repeating that that the <html> and <body> elements contained within the template are simply standard XML elements to the XSLT processor. It knows nothing about HTML elements and simply cares that the elements follow the XML rules. Only when processing has completed and the result tree is rendered in an application that understands HTML tags, will the <html> and <body> elements have any presentation purpose.

The xsl:template element can have the attributes shown in Table 7.2.

Table 7.2 xsl:template Attributes

Attribute Name	Description
`match`	The match attribute's value is a pattern defined by an XPath statement that states which nodes in the source XML document should be processed by the template it is associated with. Although optional, if this attribute is not included, the `name` attribute shown next must be included.
`name`	Applies a name to a template. This attribute is used by `xsl:call- template`. Although optional, if this attribute is not included, the `match` attribute shown next must be included.
`priority`	The value must be a number that says the priority of the template. The priority attribute's value will be taken into consideration if several templates match the same node.
`mode`	Applies a mode to a template. The mode is simply a name that can be used by the `xsl:apply-templates` element to hit a template that does a specific form of transformation. For example, if you need a node named `chapter` within an XML document to be processed differently, depending on its position within the document, you can create different templates that all match the `chapter` node. To differentiate the templates from each other (because they have the same `match` attribute value) a mode can be applied to each one. A call can then be made to the specific template that needs to be processed by using the `xsl:apply-templates` element and then specifying the template that has the desired mode.