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

How to Convert XML Files to HTML

, 22 Oct 2005
Rate this:
Please Sign up or sign in to vote.
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 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)

Share

About the Author

ShahabFatemi

Sweden Sweden
I am not using Microsoft.NET and Crystal report anymore.

Comments and Discussions

 
QuestionEasily works in Qt too Pinmembermwmwmw15-Apr-13 2:53 
QuestionHow do you capture the HTML output? Pinmemberjrdickerson17-Jan-12 8:54 
QuestionHow to execute TransformXML PinmemberMember 211645429-Nov-10 10:41 
GeneralMy vote of 2 Pinmemberpraveen.gupta7753@gmail.com22-Sep-10 21:31 
GeneralGeneration Successful......... Pinmembernitinr70830-Nov-07 1:10 

hi man,
 
The steps were really easy to follow, probably one of the most neat descriptive articles I have come across here,
 
Thanks........the generation and transformation of sample HTML file worked nice.
 
But I need a guidance on some manipulated generation of a new HTML file.
 
Say I have this <category> tag in the xml file with a value associated to it for all items which has to be shown ON THE RIGHT side in the Html file content corresponding to Every item's Entry on LEFT side.
 
i.e.
 
<html> file---------------------
 
Item 1                                                                                       Category1
Description1
 
Item 2                                                                                       Category2
Description2
 
----------------------End of file</html>
 
I am not so good in xsl format for html generation neither am I a total rookie..............any slight idea might help me catch some result.
 
Please reply
 
as soon as possible
Smile | :)

 
NITIN

QuestionMailing xml with xslt PinmemberJJDPPROGRESS12-Jan-06 20:52 

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

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Mobile
Web03 | 2.8.140827.1 | Last Updated 22 Oct 2005
Article Copyright 2005 by ShahabFatemi
Everything else Copyright © CodeProject, 1999-2014
Terms of Service
Layout: fixed | fluid