janv. 07

During my last days of vacations, I have decided to add a new page in my blog, listing the different trainings I gave these last years. My idea ? To have a simple page, based on a XML file, easy to maintain and that would be able to display several views on fhe same information. So I have immediately been thinking to using a GridView and an XmlDataSource. Here is below some tips about the combination of the two.

1. Using a GridView to display attributes from an Xml file

By default, XmlDataSources and GridView will work to display tabular data from an Xml file, and so will based all its behavior on XML attributes.

Let's imagine you have a simple XML file like this:

<?xml version="1.0" encoding="utf-8" ?>
<Trainings>
   <Training presentator="Pierre-Emmanuel Dautreppe"
             title="My Training title"
             description="This is my description" 
             date="2007-12-01" />
</Trainings>

you could very simply create a GridView to display the data :

<asp:GridView ID="GridView1" runat="server"
   DataSourceID="XmlDataSource1"
   AutoGenerateColumns="false" >
   <Columns>
      <asp:BoundField HeaderText="Title" DataField="Title" />
      <asp:BoundField HeaderText="By" DataField="Presentator" />
   </Columns>
 </asp:GridView>
<asp:XmlDataSource ID="XmlDataSource1" runat="server" 
   DataFile="~/App_Data/Trainings/AttributesTrainings.xml" 
   XPath="Trainings/Training" />
Be careful to check that your DataFile correspond to your Xml File
And  you are done ! Here is your GridView :

2. Using a GridView to display elements from an Xml file

Of course, in some case, this won't work because you may not have all your data in attributes. Let's imagine for example you have to add some special characters, or using a collection, or ... There would be plenty of good reasons to have an XML structure more complex. So let's imagine your XML file is now like :

<?xml version="1.0" encoding="utf-8" ?>
<Trainings>
   <Training title="My Training title"
             description="This is my description"
             date="2007-12-01">
      <Presentator>
         <![CDATA[Pierre-Emmanuel Dautreppe & Other]]>
      </Presentator>
   </Training>
</Trainings>

You can simply update slightly your GridView to have

<asp:GridView ID="GridView1" runat="server" 
   DataSourceID="XmlDataSource1" AutoGenerateColumns="false" >
   <Columns>
      <asp:TemplateField HeaderText="By">
         <ItemTemplate><%# XPath("Presentator")%></ItemTemplate>
      </asp:TemplateField>
      <asp:BoundField HeaderText="Title" DataField="Title" />
   </Columns>
 </asp:GridView>
<asp:XmlDataSource ID="XmlDataSource1" runat="server" 
   DataFile="~/App_Data/Trainings/ElementsTrainings.xml" 
   XPath="Trainings/Training" />
Be careful to check that your DataFile correspond to your Xml File

3. Using XSL files to tranform an XML file and facilitate the data display

In the end you will probably have Xml files much more complex. But this is not a problem as you can always update your XmlDataSource definition to reference an Xsl file. With it, you will be able to do whatever you want, and so in fine to arrive to an Xml structure like one of the two previous ones.

Let's take an example with this xml file :

<?xml version="1.0" encoding="utf-8" ?>
<Trainings>
   <Presentators>
      <Presentator id="1">
         <FirstName>Pierre-Emmanuel</FirstName>
         <Name>Dautreppe</Name>
      </Presentator>
      <Presentator id="2">
         <FirstName>FirstName</FirstName>
         <Name>OtherName</Name>
      </Presentator>
   </Presentators>
   <Trainings>
      <Training>
         <Presentators>
            <Presentator>1</Presentator>
            <Presentator>2</Presentator>
         </Presentators>
         <Title><![CDATA[Titre & 1]]></Title>
         <Description></Description>
         <Date></Date>
      </Training>
   </Trainings>
</Trainings>

We can create an XSL file to convert it (note that I'm not an XSL expert... if you see any error or possible improvement, leave a comment !):

<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0" 
                xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
 
<xsl:template match="/">
   <Trainings>
      <xsl:apply-templates select="/Trainings/Trainings" />
   </Trainings>
</xsl:template>
 
<xsl:template match="/Trainings/Trainings">
   <xsl:for-each select="Training">
<Training>
   <Presentator>
      <xsl:for-each select="Presentators/Presentator">
         <xsl:variable name="id" select="." />
         <xsl:value-of 
            select="//Presentators/Presentator[@id=$id]/Name"/>
         <xsl:if test="position()!=last()">, </xsl:if>
      </xsl:for-each>
   </Presentator>
   <Title><xsl:value-of select="Title"/></Title>
   <Description><xsl:value-of select="Description"/></Description>
   <Date><xsl:value-of select="Date"/></Date>
</Training>
   </xsl:for-each>
</xsl:template>
 
</xsl:stylesheet>

With this new XML file and the corresppoonding XSL, we can now update the aspx page as follows

<asp:GridView ID="GridView2" runat="server" 
   DataSourceID="XmlDataSource2" AutoGenerateColumns="false" >
   <Columns>
      <asp:TemplateField HeaderText="By">
         <ItemTemplate><%# XPath("Presentator")%></ItemTemplate>
      </asp:TemplateField>
      <asp:TemplateField HeaderText="Title">
         <ItemTemplate><%# XPath("Title")%></ItemTemplate>
      </asp:TemplateField>
   </Columns>
 </asp:GridView>
<asp:XmlDataSource ID="XmlDataSource2" runat="server" 
   DataFile="~/App_Data/Trainings/Trainings.xml" 
   TransformFile="~/App_Data/Trainings/TrainingDisplay.xsl"
   XPath="Trainings/Training" />

And here it is ! Once again, the display works perfectly:

Tags: | | | | |