Click here to Skip to main content
Click here to Skip to main content

How to Convert XML Files to HTML

By , 22 Oct 2005
 

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 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 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 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 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

  • 22nd October, 2005: Initial post

License

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

About the Author

ShahabFatemi
Other
Sweden Sweden
Member
I got double MSc degree in Space Science and Technology from Luleå Technical University in Sweden and Paul Sabatier Toulouse in France.

Sign Up to vote   Poor Excellent
Add a reason or comment to your vote: x
Votes of 3 or less require a comment

Comments and Discussions

 
Hint: For improved responsiveness ensure Javascript is enabled and choose 'Normal' from the Layout dropdown and hit 'Update'.
You must Sign In to use this message board.
Search this forum  
    Spacing  Noise  Layout  Per page   
GeneralMy vote of 2memberpraveen.gupta7753@gmail.com22 Sep '10 - 21:31 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Permalink | Advertise | Privacy | Mobile
Web02 | 2.6.130516.1 | Last Updated 22 Oct 2005
Article Copyright 2005 by ShahabFatemi
Everything else Copyright © CodeProject, 1999-2013
Terms of Use
Layout: fixed | fluid