AspdotnetCodes.com
Search
Articles
Books
Resources
Asp.Net News
Downloads
Free Tech Magazines
Asp.Net Web Hosting
Archives
Softwares
Newsletter
Suggest Us
Link to Us
Feeds Subscription
Articles
Questions & Answers
Tips & Tricks
 Transforming XML through XSLT with Asp.Net XML Control
Posted by Moderator1 on 6/26/2007 11:30:33 AM Category: Asp.Net 2.0
Total Views : 103137
Add to my favorites
Email to friend
  
Introduction
This article makes clear the concept of transforming XML Document through a well-defined XSLT incorporated with Asp.Net XML Control.
Description
Nowadays XML (eXtensible Markup Language), has occupied a huge part of Asp.Net Technology. Although most of the XML functionality in the .NET Framework can be found in System.Xml namespace, we can also find the influence of XML throughout the entire frameworks including System.Data and System.Web and on so many other namespaces too. Yes, XML provides the core structure within which data can be stored and passed throughout the Internet. Though the XML document provides the content needed, but there is no information about how that content should be presented.

Now XSLT comes to center stage. XSLT is a language for transforming the structure of an XML document. With XSLT, we can select the elements we want to present, rearrange them, and either output them as a new XML document or provide additional formatting to create an HTML document, a PDF file or a set of SQL instructions – whatever we want. XSLT is a W3C specification; the current version is 1.0, and version 2.0 is a working draft currently under review. And this article, explains you the concept of transforming an XML Document with two different XSLT formats with the help of Asp.Net XML Control. Asp.Net XML control is a new feature available in Asp.Net 2.0 framework, which helps to easily bind XML document with any XSLT.
Sample Scenario

I have some collections of CDs with me. I fed these CDs information in an XML document. Now I’m going to display it for you in two formats. The first XSLT transforms the XML in a List format. While the second XSLT transforms it in a Tabular format. Let us start by creating an xml file in your visual studio web application and name it as cdlist.xml. Copy and paste the following sample file, if you don’t have one.

XML CDList.xml

The structure of the Xml file looks as below
<?xml version="1.0" encoding="utf-8" ?>
<CDLIST>
  <XMLTITLE>My CD Collections</XMLTITLE>
  <CD>
    <TITLE>Spider-Man 3</TITLE>
    <ARTIST>Tobey Maguire</ARTIST>
    <COUNTRY>USA</COUNTRY>
    <COMPANY>Sony Pictures</COMPANY>
    <PRICE>20.90</PRICE>
    <YEAR>2007</YEAR>
  </CD>
  <CD>
    <TITLE>The Pink Panther</TITLE>
    <ARTIST>Steve Martin</ARTIST>
    <COUNTRY>UK</COUNTRY>
    <COMPANY>MGM Distribution Company</COMPANY>
    <PRICE>17.90</PRICE>
    <YEAR>2006</YEAR>
  </CD>
  <CD>
    <TITLE>Mission: Impossible III </TITLE>
    <ARTIST>Tom Cruise</ARTIST>
    <COUNTRY>USA</COUNTRY>
    <COMPANY>Paramount Pictures</COMPANY>
    <PRICE>12.90</PRICE>
    <YEAR>2006</YEAR>
  </CD>
  <CD>
    <TITLE>Indepence Day</TITLE>
    <ARTIST>Will Smith</ARTIST>
    <COUNTRY>USA</COUNTRY>
    <COMPANY>Columbia Pictures</COMPANY>
    <PRICE>9.90</PRICE>
    <YEAR>1997</YEAR>
  </CD>
</CDLIST>
Create First XSLT File ‘ListFormat.xsl’

Before we go to create the format in the XLS file let me give you some basic idea regarding the XSLT elements. The XSLT stylesheet itself is a valid XML document and must follow the rules of well-formed. It contains special elements that are defined by XSLT, which provide rules for the transformation, and may also contain other types of elements or formatting codes (HTML tags, for example). XSLT-defined elements belong to the XSLT namespace and are distinguished from other elements by the XSLT namespace prefix (typically xsl:).
xsl:for-each

This element appears inside a template and it will iterate through a set of nodes. We have to mention the nodes hierarchy as value for the select attributes. The syntax is
<lt;xsl:for-each select="node-list"/>
[. . .]
</xsl:for-each>

xsl:value-of

When this XSLT element appears in a template, it tells the processor to compute the value of the selected node and copies it into the output document. The item whose value is selected is relative to the current node. The syntax is
<xsl:value-of select="expression"/>

We are going to use these two elements to traverse the xml file, retrieve the value of each node and output those values to the aspx file. Now its time to add a new XSLT file to your application. Right click on your project in the solution explorer, click on Add New Item, choose XSLT File and name it as ListFormat.xsl. The new xsl document will have the following structure.
<?xml version="1.0" encoding="utf-8"?>

<xsl:stylesheet version="1.0"
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

<xsl:template match="/">
    <html>
    <body>
    <!--
        This is an XSLT template file. Fill in this area with the
        XSL elements which will transform your XML to XHTML.
    -->
    </body>
    </html>
</xsl:template>

</xsl:stylesheet>


Since we are going to output the XML in an aspx page, the <html> and <body> tags within the <xsl:template> section has no effect in the output, so we can remove it. Inside the <xsl:template> section, insert a <h2> element to display some header text. Between the header tags, insert the <xsl:value-of> tag and set its select’s attributes value to the XmlTitle node. You have to traverse from the parent node to the child node. See below the select attibutes value is “CDList/XmlTitle”. That is the CDList is the parent node and you need the value of XMLTitle. So its very clear.

<h2>
<xsl:value-of select="CDList/XmlTitle"/>
</h2>

Next we need to design a Html table to display the data in a list format. Insert a HTML table into the <xsl:template> section with two rows and six columns. The first row will be the header row for the table. From the section row we will display the data. Before the beginning of the second row’s <tr> tag we have to insert the <xsl:for-each> element. This element is response for iterating the whole xml document on the specified node list mentioned in the select attribute. So the value for the select attribute will be “CDList/CD”. At each cell of the row, we have to specify the <xsl:value-of select="YourNodeToDisplay" /> element with the select attributes value should be the node value to want to output in that cell. So the whole ListFormat.xsl will look like below

 
<table width="500" border="1">
<tr>
<td width="125">CD Name</td>
<td width="100">Artist</td>
<td width="75">Country</td>
<td width="75">Company</td>
<td width="75">Price</td>
<td width="50">Year</td>
</tr>
<xsl:for-each select="CDList/CD">
<tr>
<td><xsl:value-of select="TITLE" /></td>
<td><xsl:value-of select="ARTIST" /></td>
<td><xsl:value-of select="COUNTRY" /></td>
<td><xsl:value-of select="COMPANY" /></td>
<td><xsl:value-of select="PRICE" /></td>
<td><xsl:value-of select="YEAR" /></td>
</tr>
</xsl:for-each>
</table>


Create Second XSLT File ‘TableFormat.xsl’

Right click on your project in the solution explorer, click on Add New Item, choose XSLT File and name it as TableFormat.xsl. We are exactly going to do the same things as we did for ListFormat.xsl, but slightly different in the structure of the Html table. See below for the format of the Html table below

<h2>
<xsl:value-of select="CDList/XmlTitle" />
</h2>
<table width="500" border="1">
<xsl:for-each select="CDList/CD">
<tr>
<td>
<b>Title: <xsl:value-of select="TITLE" />
</b><br />
Artist: <xsl:value-of select="ARTIST" /><br />
Country: <xsl:value-of select="COUNTRY" /><br />
Company: <xsl:value-of select="COMPANY" /><br />
Price: $ <xsl:value-of select="PRICE" /><br />
Year: <xsl:value-of select="YEAR" />
</td>
</tr>
</xsl:for-each>
</table>

Now, we have a XML with data and two XSLT files with two different structures to perform transformation.

Move towards Default.aspx Page

In your Default.aspx page, drag and drop an Asp.Net XML Control from the Toolbox Standard tab. The ID of this control will be Xml1. Specify the DocumentSource property to point the XML file that is CDList.xml. Then specify the TransformSource property to ListFormat.xsl. Run your page in browser, You can see the data in the XML file is getting displayed in the way you defined in the ListFormat.xsl. Now change the TransformSource property to point the second xsl file that is TableFormal.xsl and run the application, you will be surprised on seeing the same data in different structure.

<asp:Xml ID="Xml1" runat="server" DocumentSource="~/cdlist.xml" TransformSource="~/listformat.xsl"></asp:Xml>


You can even set the DocumentSource and TransformSource property at runtime. Asp.Net XML Control is an excellent stuff offered my Microsoft to render the XML document with any desired structure at runtime. Ease of code and consume less time to build any XML oriented application.


To view our sample application, click here.
 
Viewer's Comments
Posted by rajesh patel on 8/3/2007 7:08:55 AM
its was very nice i did according to that andi found approprite result
 
Posted by Rathikumar.V on 9/22/2007 1:07:16 AM
im trying to crete my self same as your article"Transforming XML through XSLT with Asp.Net XML Control". when i run the application, the structure of the XSLT is displayed,But its not reurnt the values from the XML file. Can u help me!!!!!1
 
Posted by Chirag Darji on 11/20/2007 6:12:06 AM
Hi, Thanks for providing this simplest example. This will help a lot to new learner like me. !! Chirag Darji http://chiragrdarji.wordpress.com
 
Posted by Keyur Patel on 11/20/2007 6:18:18 AM
Hi, This one is very simplest example of xslt. thanks
 
Posted by varaprasad on 12/31/2007 2:53:13 AM
this article is very good, it is very helpful for beginers
 
Posted by SARATH on 3/14/2008 2:34:01 AM
NEVER
 
Posted by SARATH on 3/14/2008 2:35:20 AM
This article is good for learners
 
Posted by chhaya on 3/18/2008 5:48:33 AM
Hey, ur artical is very good and upto the mark...At first attempt only i got the result.
 
Posted by jobi on 4/24/2008 1:17:56 AM
A good and simple approach..
 
Posted by Sachin on 5/23/2008 7:15:51 AM
How i get an multiple values from XSLT in ASP.Net While i redirect a page.
 
Posted by .net developer on 6/8/2008 4:26:29 PM
Thanks Very helpful
 
Posted by mohd abid on 6/13/2008 2:25:24 AM
Thanks For Help Me
 
Posted by Maneesh on 6/16/2008 3:53:41 AM
i m trying as in your article but it works fine without showing the value (only display the data structure).
 
Posted by Nataraj Poddar on 6/23/2008 5:04:48 AM
Nice documentation. It would great helpful to reader if you add some more sample source code with conditional, looping and formatting table using XSLT.
 
Posted by cinek on 8/18/2008 8:57:17 AM
very good for beginners, thanks mate!
 
Posted by rajesh on 8/25/2008 1:23:27 AM
everything k but i am not able to display the values
 
Posted by Dissed on 10/4/2008 6:18:31 PM
It don't work. Take it offline or offer the code that does work as a download.
 
Posted by Dissed on 10/4/2008 6:33:24 PM
Correct the xsl file as follows: Change the line with: select="CDList/XmlTitle" To: select="CDLIST/TITLE" And the line: select="CDList/CD" To: select="CDLIST/TITLE" You see the calls in the xsl must respect the case of the xml elemet being 'matched' otherwise nothing gets selected. Now, give it go and you'll see the results. Strictly beginner code though, including the mistakes. :-0
 
Posted by Thangapandian on 1/2/2009 2:23:41 AM
it dont work title only displayed anyone plz send me correct code int the xslt
 
Posted by flor on 1/28/2009 9:17:10 PM
Thanks For Helping Me.
 
Posted by Donald on 2/17/2009 7:23:21 AM
Thanks for your help, it was good
 
Posted by basantkumar on 2/27/2009 9:29:50 AM
any table coding xml througt XSLT ANY XML FILE CONVERT TO HTML THROUGHT XLST ANY HTML FILE CONVERT TO XML THROUGHT XLST
 
Posted by vikrant Kale on 2/28/2009 6:11:23 AM
This very user friendly Information Thanks
 
Posted by KAVEH YOUSSEFI on 5/18/2009 11:14:11 AM
Thanks
 
Posted by Kalpesh Joshi on 6/12/2009 9:05:02 AM
I tried copying same XML and XSL, and in XML control I specified DocumentSource and TransformSource accordingly but still I couldn't resultant data... Help!!!!!! Someone nows better than this, then please post into blog
 
Posted by abhi on 8/1/2009 4:43:28 AM
search 'CDList' <-- Make this UPPERCASE
 
Posted by India on 8/19/2009 11:35:40 PM
Excellent..!!!Excellent..!!!Excellent..!!! Thank You very much..!!!!
 
Posted by Hardeep Singh on 9/7/2009 7:09:36 AM
I want a example where events handle in xslt file
 
Posted by Sanjay Bhakkad on 8/2/2010 7:38:43 PM
Thanks, Very good article for beginners. You have clearly explain the required xsl tags also which is very useful.
 
Posted by Sreedhar on 11/2/2010 7:19:50 AM
It is a very nice article. Thanks.
 
Posted by surya on 2/9/2012 12:22:36 AM
Excellent... Useful Article I am very new to XSLT . This article simply describes all and it is good article for beginners...
 
Posted by Beenu on 2/29/2012 4:42:23 AM
Nice article, this has become my best material on XML Control in ASP.Net. You made this very simple and understandable. An another article also helped me lot when I was searching on this topic. So I want to share that post link... http://mindstick.com/Articles/d960aa32-dc17-422f-bea6-42bfb40d2095/?XML%20Control%20in%20ASP.Net
 
 Rating & Comments
A word 'Excellent' means lot to the author of this article. You can give comments about this article but not the author.
Rate this Article:
Name:
Email Id:  
We never display your email id anywhere.
Comment/Question: Max. 500 letters
Five plus Ninety Equals To
 
Sponsored by
Sexy Web Design - Free 71 Page Preview!
Backup and Recovery Best Practices for Microsoft SQL Server 2005
Build Your Own ASP.NET 3.5 Web Site Using C# & VB, 3rd Edition - Free 219 Page Preview!