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