Introduction:If you are not familiar with new XmlDataSource control, check "Using XmlDataSource" article. The main idea here is that we have two XmlDataSources that both use one single Xml file, with different XPath properties though. The "filtering" in second GridView that shows only books for selected author is done with chaning XPath property of the XmlDataSource for the second GridView. Those of you who are just starting with ASP.NET 2, note the new command in GridView (SELECT), which replaces ItemCommand and then getting DataKey with e.Item.ItemIndex. It's much simpler now, but old dog needs to learn some new tricks. You can see online demo here and download source here.
1. Create XmlDataSource for GridView Authors and GridViewBooks
Insert this tag on the web form to create DataSource for gvwAuthors:
<asp:XmlDataSource ID="xmlAuthors" runat="server" DataFile="~/xml/books.xml" XPath="bookstore/authors"> </asp:XmlDataSource> Notice, how we used XPath to select only authors table (node) for this data source.
Now insert this tag to create a data source for gvwBooks, the GridView that will show books for selected Author.
<asp:XmlDataSource ID="xmlBooks" runat="server" DataFile="~/xml/books.xml"> </asp:XmlDataSource>
In second data source we have not specified XPath, because we will not bind gvwBooks to it until user selects an author. When he does select an author, we will create XPath on the fly and bind gvwBooks to datasource xmlBooks.
2. Create GridView controls gvwAuthors and gvwBooks
<asp:GridView ID="gvwAuthors" runat="server" AutoGenerateColumns="False" DataSourceID="xmlAuthors" DataKeyNames="ID" OnSelectedIndexChanged="gvwAuthors_Select">We have set DataSourceID to xmlAuthors which we have created in step 1. Also we have set DataKeyNames="ID", because we want to be able to retrieve the ID of an author when user selects it. As I have already mentioned, there is a difference here in regard to ASP.NET 2. We have "OnSelectedIndexChanged" event which is triggered by "CommandField" which has ShowSelectButton to true. We will get later to that method, which is also the only "non-declarative" piece of code in this example.
<asp:BoundField DataField="name" HeaderText="Name" SortExpression="name" /> <asp:BoundField DataField="country" HeaderText="Country" SortExpression="country" /> <asp:CommandField EditText="Show books" SelectText="Show books" ShowSelectButton="True" />
Now, let's add second GridView (gvwBooks) which we will use to show the books written by a selected author.
<asp:GridView ID="gvwBooks" runat="server" AutoGenerateColumns="False">
<asp:BoundField DataField="title" HeaderText="Book title" SortExpression="title" /> </Columns>
Notice that we are not setting the "DataSourceID" property here, because we don't want to bind it before user selects an author.
3. Add method gvwAuthors_Select
<script runat="server"> This method is called whenever a user clicks "Show Books" link in GridView gvwAuthors. First thing we are doing is getting authorID. You may notice the change between ASP.NET 1 and ASP.NET 2. GridView has SelectedValue (which correspondens to DataKeyName we have set for this GridView) property.
private void gvwAuthors_Select(object s, EventArgs e)
string authorID = gvwAuthors.SelectedValue.ToString() ;
xmlBooks.XPath = "bookstore/books[@authorID=" + authorID + "]";
gvwBooks.DataSourceID = "xmlBooks";
Second line sets the XPath property of xmlBooks XmlDataSource. We are taking all books entries where authorID is equal to SelectedValue/authorID. At the end we simply set the DataSourceID of GridView gvwBooks to "xmlBooks". Notice that this property sets the DataSourceID, therefore the value is string and not an object.
Conclusion I have purposly used two GridViews to explore the new GridView functionality. An alternative could be to use DropDownList and GridView, which most of you will probably use more commonly. The principle is same though.