The Transformation
The Transformation
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<HTML><BODY topmargin="0"><TABLE BORDER="1" WIDTH="100%">
<BR/>
<TR STYLE="font-size:10pt; color:blue; text-decoration:none;font-weight:bold;"
align="center">
<TD STYLE="background-color:white">Id:</TD>
<TD STYLE="background-color:white">Author:</TD>
<TD STYLE="background-color:white">Phone:</TD>
<TD STYLE="background-color:white">Address:</TD>
<TD STYLE="background-color:white">Contract:</TD>
</TR>
<xsl:for-each select="PubsList/Pubs">
<TR STYLE="font-size:10pt; color:black; padding:0px 6px" align="center">
<TD width='20%'><xsl:value-of select="au_id"/></TD>
<TD width='25%'>
<xsl:value-of select="au_fname"/> <xsl:value-of select="au_lname"/>
</TD>
<TD width='20%'><xsl:value-of select="phone"/></TD>
<TD width='40%'>
<xsl:value-of select="address"/>
<xsl:value-of select="city"/>, <xsl:value-of select="state"/> <xsl:value-of
select="zip"/>
</TD>
<TD width='20%'><xsl:value-of select="contract"/></TD>
</TR>
</xsl:for-each></TABLE>
<BR/>
</BODY></HTML>
</xsl:template>
</xsl:stylesheet>
Ok and This All Means What?
Well, it's like HTML but...not quite. Actually, all the above is what will
transform our XML into readable HTML with a format that's easy on the eyes.
What we do here first in line one is write out our XML declaration (or processing
instructions). Then move to the <xsl:template match="/">
which defines or matches our whole document, which we then intersperse with
HTML markup.
After we markup up our header row, we now begin looping through each of our
child nodes that begin with Pubs (which denote each row of data contained within
our parent or root node PubsList). If you open and display the raw XML in your
browser you'll notice that PubsList is the parent node enclosing all the Pubs
child nodes and their elements. The transformation below is simply setting up
a loop which iterates through them,
<xsl:for-each select="PubsList/Pubs">
whereby the formatting occurs with each element being wrapped in some HTML
tags as in one datarow example below:
<TD width='20%'><xsl:value-of select="phone"/></TD>
At the end of the XSL template, you'll observe the loop's closing tags and
the final HTML tags. In case your wondering what the   is? Well it's
simply XSL's way of writing a blank space.
There... not too difficult, was it? If you are still finding it a little difficult
to grasp the fine art of XSL transformations, you'll find plenty of resources
on the web to help you since this is beyond the scope of this article. Even
so, within the context of this article, it essentially shouldn't be to difficult
to follow.
The Datagrid
Now for something even less demanding. Providing you've used the methods above
to produce an XML document on your local disk, or anyone for that matter, binding
to a DataGrid Web Control will require only four lines of code! Have a look.
void Get_XML_DataGrid(){
DataSet myDataSet = new DataSet();
myDataSet.ReadXml(Server.MapPath("pubs.xml"));
xmlDG.DataSource = myDataSet;
xmlDG.DataBind();
}
And instead of writing the results out by using the XML Web control, you now
can use the DataGrid control like so:
<asp:DataGrid id="xmlDG" runat="server" />
So now simply replace the Get_XML_Data() method with the Get_XML_DataGrid()
method and swap the two output controls and you're set. Once more, make sure
there is XML to read. Moreover, the Datagird web control presented above is
the absolute most simplest configuration. Be sure to read the .NET tutorials
on dressing it up to your liking and even on adding paging to it as well.
Be sure to check out my other article which goes
into greater detail on paging a Datagrid with exact count. I'll leave it up
to you .NET wizards to merge the two articles in one cool app!