Using XSLT to Transform XML Using ASP.NET

This article gives a brief introduction on XML, XSLT and provides a step-by-step procedure on how XML can be transformed using ASP.NET with the help of code samples in C#.

This article demonstrates how to transform XML using XSLT in ASP.NET using C#. It explains the basics of XML, XSLT and how we could take advantage of XSLT in the web pages that use ASP.NET.

What is XML (eXtensible Markup Language)?

XML has become one of the popular standards for data storage and data transfer. XML does not define tags like other markup languages. Instead, it lets you define your own tags.

What is XSLT (eXtensible Stylesheet Language Transformation)?

to display the XML data there is a need for a language to transform the data. To accommodate this process, XSLT was created. XSLT can be applied to transform XML data into different formats, such as HTML.

The figure below illustrates the transformation process.




What is the difference between XSL and XSLT?
[ Back To Top ]


I have seen XSL and XSLT used interchangeably in the Web developer world. It is, however, helpful to know the difference. XSL (Extensible Stylesheet Language) is the superset of XSLT as it includes XSLT and XSL formatting objects. By using the term XSL, they implicitly mean XSLT.

Transforming XML data using ASP.NET
[ Back To Top ]


Step 1: Create the XML file

XML can be in memory representation or a flat file. The XML file that I will be using for this illustration is shown below. This file has the population data of different countries along with the names of cities and percentage of population.


<countries&rt;
<country name="USA" continent="North America"&rt;
<stats&rt;
<Population&rt;301,139,947</Population&rt;
<cities&rt;
<city name="NYC" percentage="2.72"/&rt;
<city name="Los Angeles" percentage="1.15"/&rt;
<city name="Chicago" percentage="0.94"/&rt;
</cities&rt;
</stats&rt;
</country&rt;
<country name="India" continent="Asia"&rt;
<stats&rt;
<Population&rt;1,129,866,154</Population&rt;
<cities&rt;
<city name="Bangalore" percentage="0.50"/&rt;
<city name="Chennai" percentage="0.58"/&rt;
<city name="Kolkata" percentage="0.60"/&rt;
</cities&rt;
</stats&rt;
</country&rt;
<country name="China" continent="Asia"&rt;
<stats&rt;
<Population&rt;1,321,851,888</Population&rt;
<cities&rt;
<city name="Beijing" percentage="1.10"/&rt;
<city name="Shanghai" percentage="1.51"/&rt;
<city name="Tianjin" percentage="0.51"/&rt;
</cities&rt;
</stats&rt;
</country&rt;
</countries&rt;

Copy this data into a file and name it aspalliance.xml.

Step 2: Create the XSLT file

The XSLT file can be created using your favorite editor. I recommend XML Spy because it has very good support for XML and XSLT. The stylesheet for this example is shown below.



<?xml version="1.0" encoding="UTF-8"?&rt;
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"&rt;
<xsl:output method="xml" version="1.0" encoding="UTF-8" indent="yes"/&rt;
<xsl:template match="/"&rt;
<html&rt;
<head/&rt;
<body&rt;
<h1&rt;Countries</h1&rt;
<xsl:apply-templates/&rt;
</body&rt;
</html&rt;
</xsl:template&rt;
<xsl:template match="countries"&rt;
<xsl:apply-templates/&rt;
</xsl:template&rt;
<xsl:template match="country"&rt;
<h3&rt;
<xsl:value-of select="@name"/&rt; (<xsl:value-of select="@continent"/&rt;)
</h3&rt;
<xsl:apply-templates/&rt;
</xsl:template&rt;
<xsl:template match="stats"&rt;
Population : <xsl:value-of select="@Population"/&rt;
<xsl:apply-templates/&rt;
</xsl:template&rt;
<xsl:template match="cities"&rt;
<table border="1" &rt;
<tr&rt;
<td&rt;Name</td&rt;
<td&rt;Percentage</td&rt;
</tr&rt;
<xsl:apply-templates/&rt;
</table&rt;
</xsl:template&rt;
<xsl:template match="city"&rt;
<tr&rt;
<td&rt;
<xsl:value-of select="@name"/&rt;
</td&rt;
<td&rt;
<xsl:value-of select="@percentage"/&rt;
</td&rt;
</tr&rt;
<xsl:apply-templates/&rt;
</xsl:template&rt;
</xsl:stylesheet&rt;

Some important notes about XSLT

You will have noticed that I have a template section for every XML element. When the XSLT processor encounters the statement , it searches for the template that matches (ex: ) and applies it.

The syntax is used to print the value of the element/attribute.

Copy this XSLT into a file and name it aspalliance.xslt.

Step 3: Create a web page that displays the XML using XSLT in ASP.NET

ASP.NET has excellent support for XML and XSLT. First, import the necessary namespaces.

Listing 3

using System.Xml;
using System.Xml.Xsl;
using System.Xml.XPath;
using System.IO;Add the XML and XSLT files into the web project. Create an aspx page (or a ascx control) and use the method (ApplyXSLTransformation()) below that will read the XML and the XSLT document and return a string that is the HTML representation of the transformed XML data.

Listing 4

private string ApplyXSLTransformation()
{
string strHtml;

string strXstFile = Server.MapPath("aspalliance.xslt");
XslCompiledTransform x = new XslCompiledTransform();

// Load the XML
XPathDocument doc = new XPathDocument(Server.MapPath("aspalliance.xml"));

// Load the style sheet.
XslCompiledTransform xslt = new XslCompiledTransform();
xslt.Load(strXstFile);
MemoryStream ms = new MemoryStream();
XmlTextWriter writer = new XmlTextWriter(ms, Encoding.ASCII);
StreamReader rd = new StreamReader(ms);
xslt.Transform(doc, writer);
ms.Position = 0;
strHtml = rd.ReadToEnd();
rd.Close();
ms.Close();
return strHtml;
}You can use the string (strHtml) that is returned in this method in anyway useful for your application. Ex: You can assign it to a label or process it further as needed.

Step 4: View the Output

The output of transformation is shown in the figure below.









In this article I covered the basics of XML and XSLT. I also illustrated how to transform XML data using XSLT in ASP.NET. Happy Coding!