The previous step is nice because we can now see the 5 most
recent orders for each customer, but the downside is that it has expanded the
html height quite a bit. To make the listing a little cleaner we’ll go
ahead and enable paging support on the GridView, set the pagesize to 3 rows per
page, and handle the appropriate page event handler in our code-behind to
re-bind the Grid as appropriate when users click on the new page index at
the bottom of the grid
For completeness, here is what the entire .aspx file looks
like with the Gridview with hierarchical binding and paging enabled:
Listing 14
<%@ Page Language="C#" CodeFile="Sample4.aspx.cs" Inherits="Sample4" %>
<html>
<body>
<form id="form1" runat="server">
<h1>Northwind Customers</h1>
<asp:GridView ID="GridView1" AllowPaging="true" PageSize="3"
AutoGenerateColumns="false" runat="server"
OnPageIndexChanging="GridView1_PageIndexChanging">
<Columns>
<asp:BoundField HeaderText="Customer ID" DataField="CustomerID" />
<asp:BoundField HeaderText="Name" DataField="CompanyName" />
<asp:BoundField HeaderText="City" DataField="City" />
<asp:BoundField HeaderText="State" DataField="Region" />
<asp:BoundField HeaderText="NumOrders" DataField="NumOrders" />
<asp:TemplateField HeaderText="Recent Orders">
<ItemTemplate>
<ul>
<asp:Repeater datasource='<%# Eval("Orders") %>' runat="server">
<ItemTemplate>
<li>
<a href="todo"><%# Eval("OrderID") %></a>
(<%# Eval("OrderDate", "{0:dd MMM yyyy}")%>)
</li>
</ItemTemplate>
</asp:Repeater>
</ul>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</form>
</body>
</html>
And here is then the entire code-behind:
Listing 15
using System;
using System.Configuration;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Query;
public partial class Sample4 : System.Web.UI.Page {
void BindData() {
string connStr = ConfigurationManager.ConnectionStrings["Northwind"].ConnectionString;
Northwind.Northwind db = new Northwind.Northwind(connStr);
GridView1.DataSource = (from customer in db.Customers
where customer.Country == "USA"
orderby customer.CompanyName
select new {
CustomerID = customer.CustomerID,
CompanyName = customer.CompanyName,
City = customer.City,
Region = customer.Region,
NumOrders = customer.Orders.Count,
LastOrder = customer.Orders.Max(o => o.OrderDate),
Orders = customer.Orders.OrderByDescending(o => o.OrderDate).Take(5)
}).ToList();
GridView1.DataBind();
}
protected void Page_Load() {
if (Page.IsPostBack == false)
BindData();
}
protected void GridView1_PageIndexChanging(object sender, GridViewPageEventArgs e) {
GridView1.PageIndex = e.NewPageIndex;
BindData();
}
}
And now I have a pageable GridView, showing both relational
data and calculated aggregate data, both in a tabular and hierarchical way:
Figure 6