How to Convert XML Files to HTML

ShahabFatemi

2.93/5 (17 votes)

22 Oct 2005CPOL

You have an XML document and you need to convert it into a more readable file format.

Introduction

You have an XML document and you need to convert it into a more readable file format. For example, you have personnel data that is stored as an XML document and you need to display it on a Web page or in a text file.

Solution

The solution for this is to use an XSLT stylesheet to transform the XML into another format using the XslTransform class. In the example code, we are transforming some personnel data from a fictitious business stored in Personnel.xml. First, we load the stylesheet for generating HTML output. Then we perform the transformation to HTML via XSLT using the PersonnelHTML.xsl stylesheet. After that, we transform the data to comma-delimited format using the PersonnelCSV.xsl stylesheet:

public static void TransformXML( )
{
      // Create a resolver with default credentials.
      XmlUrlResolver resolver = new XmlUrlResolver( );
      resolver.Credentials = System.Net.CredentialCache.DefaultCredentials;
      // transform the personnel.xml file to HTML
      XslTransform transform = new XslTransform( );
      // load up the stylesheet
      transform.Load(@"..\PersonnelHTML.xsl",resolver);
      // perform the transformation
      transform.Transform(@"..\Personnel.xml",@"..\Personnel.html",resolver);
      // transform the personnel.xml file to comma delimited format
      // load up the stylesheet
      transform.Load(@"..\PersonnelCSV.xsl",resolver);
      // perform the transformation
      transform.Transform(@"..\Personnel.xml", @"..\Personnel.csv",resolver);
}

The Personnel.xml file contains the following items:

XML

<?xml version="1.0" encoding="utf-8"?>
<Personnel>
     <Employee name="Shahab" title="Customer Service" companyYears="1"/>
     <Employee name="Noosha" title="Manager" companyYears="12"/>
     <Employee name="NavidChas" title="Salesman" companyYears="3"/>
     <Employee name="Mehrdad" title="CEO" companyYears="27"/>
<Personnel>

The PersonnelHTML.xsl stylesheet looks like this:

XML

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" 
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform" 
           xmlns:xs="http://www.w3.org/2001/XMLSchema">
<xsl:template match="/">
<html>
<head />
  <body title="Personnel">
     <xsl:for-each select="Personnel">
     <p>
     <xsl:for-each select="Employee">
     <xsl:if test="position( )=1">
          <table border="1">
          <thead>
          <tr>
                    <td>Employee Name</td>
                    <td>Employee Title</td>
                    <td>Years with Company</td>
          </tr>
       </thead>
       <tbody>
       <xsl:for-each select="../Employee">
           <tr>
           <td>
              <xsl:for-each select="@name">
              <xsl:value-of select="." />
              </xsl:for-each>
         </td>
         <td>
              <xsl:for-each select="@title">
              <xsl:value-of select="." />
              </xsl:for-each>
        </td>
        <td>
              <xsl:for-each select="@companyYears">
              <xsl:value-of select="." />
              </xsl:for-each>
        </td>
        </tr>
        </xsl:for-each>
      </tbody>
      </table>
      </xsl:if>
</xsl:for-each>
</p>
</xsl:for-each>
</body>
</html>
</xsl:template>
</xsl:stylesheet>

Here is the HTML source:

HTML

<html xmlns:xs="http://www.w3.org/2002/XMLSchema">
<head>
<META http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body title="Personnel">
     <p>
     <table border="1"> 
     <thead>
      <tr>
          <td>Employee Name</td>
          <td>Employee Title</td> 
          <td>Years with Company</td>
     </tr> 
     </thead> 
     <tbody>
     <tr> 
          <td>Shahab</td>
          <td>Customer Service</td> 
          <td>1</td>
     </tr> 
     <tr> 
          <td>Noosha</td>
          <td>Manager</td> 
          <td>12</td>
     </tr>
     <tr> 
          <td>Navid</td>
          <td>Salesman</td> 
          <td>3</td>
     </tr>
    <tr> 
         <td>Mehrdad</td>
         <td>CEO</td> 
         <td>27</td>
    </tr>
    </tbody> 
    </table>
    </p>
</body>
</html>

The comma-delimited output is generated using PersonnelCSV.xsl and Personnel.xml; the stylesheet is shown here:

XML

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" 
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:
xs="http://www.w3.org/2002/XMLSchema">
<xsl:output method="text" encoding="UTF-8"/>
<xsl:template match="/">
<xsl:for-each select="Personnel">
<xsl:for-each select="Employee">
<xsl:for-each select="@name">
<xsl:value-of select="." />
</xsl:for-each>,<xsl:for-each select="@title">
<xsl:value-of select="." />
</xsl:for-each>,<xsl:for-each select="@companyYears">
<xsl:value-of select="." />
</xsl:for-each>
<xsl:text> &#xd;&#xa;</xsl:text>
</xsl:for-each>
</xsl:for-each>
</xsl:template>
</xsl:stylesheet>

The output from the PersonnelCSV.xsl stylesheet is shown here:

Shahab,Customer Service,1 
Noosha,Manager,12 
Navid,Salesman,3 
Mehrdad,CEO,27

History

22^nd October, 2005: Initial post

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)