Sunit Katkar's Home Page

 Tutorials:
 

Method 2: Using XSL to format the output of a parsed XML file

Here we will look at a simple XSL file which can be used for formatting our XML file and send it as HTML to the browser.

Simply put, you can think of HTML as XML + XSL = HTML

Client side parsing of XML and XSL

MS IE5.0 ® and above are capable of parsing XMl documents and showing them a tree-leaf-node struture. If you apply a XSL style-sheet to a XML file and send it to IE, it will correctly apply the styles from the XSL style sheet and render the XML file as HTML.

This method has obvious drawbacks. Different browser vendors might have different implementation of the XML and XSL standards. This could result in slightly differeing HTML output on differnt browsers. Again, some browsers are incapable of parsing XML documents for example Netscape ® 4.7. So whenever we need to send a XML file as a HTML output to a browser, it is best to parse it and apply the style sheet on the server side.

As an exercise you can download the xml and xsl files in our example and try loading them locally in your IE browser and see the result for yourself. All the files used in this example are available as a zip download at the end of this tutorial.

Server side parsing of XML and XSL

We will see first how to create a simple XSL style sheet for our XML file. Its is not very difficult to understand the synatx of XSL. Basically, when you wish to traverse and especially loop through a XML document, you use the XSL for-each statement to do so.

In our example, it is pretty simple to select the basic information about a candidate like name, email and telephone. The skill sets vary for each candidate. One has three skills whereas the second one has two. Here we need to loop through the skills and create table cells accordingly. So we start looping at the <SKILLS> tag in our XML and create a further inner loop for the <SKILL> tag.

Finally we will use ASP (as seen in the next section) to prouduce HTML.

A simple XSL file

<?xml version="1.0"?>

<!-- Standard XSL stylesheet processing Instructions -->
<xsl:stylesheet xmlns:xsl="http://www.w3.org/TR/WD-xsl">

<!-- Only interested in the root document object match -->
<xsl:template match="/">

<HTML>
  <center><P>Welcome to the ASP XML Resume Tutorial</P></center>

<!--
 Here's where we write out a row for each entry in the myResume.xml file.
 - Note how I use the 'for-each' xsl statements to get the xml contents
   in the inner nodes.
-->
    <!-- Start at the top -->
     <xsl:for-each select="CANDIDATE/CANDIDATE_INFO">
       <table width="100%" border="1" cellpadding="2" cellspacing="0">
         <tr>
           <td colspan="1"> <!-- Candidate name -->
             <b>Name:</b> <xsl:value-of select="NAME/FIRST_NAME"/> <xsl:value-of select="NAME/LAST_NAME"/>
           </td>
           <td colspan="1"> <!-- Basic bandidate information -->
             <b>Email:</b>  <xsl:value-of select="CONTACT_INFO/EMAIL"/>
             <b>Phone:</b>  <xsl:value-of select="CONTACT_INFO/PHONE"/>
           </td>
          </tr>
          <tr>
          <td colspan="1">Skills</td><td colspan="1">Experience</td></tr>
          <!-- Now loop through skills -->
          <xsl:for-each select="SKILLS">
              <!-- Not all candiadte have the same number of skills so traverse all nodes -->
              <xsl:for-each select="SKILL">
              <tr>
                <td colspan="1"><xsl:value-of select="LANGUAGE"/><br/></td>
                <td colspan="1"><xsl:value-of select="EXPERIENCE"/><br/></td>
              </tr>
               </xsl:for-each>
            </xsl:for-each>
    </table>
    <br/>
    </xsl:for-each>

</HTML>
</xsl:template>
</xsl:stylesheet>

We will now use ASP to Transform our XML file with the aid of our XSL style sheet and produce HTML output.

 

Main |  1 |  2 |  3 |  4