ASP.NET2.0利用Gridview实现主从关系(2)

接下来，我们以另外一种更直观的方式，实现master-detail的主从关系．我们以northwind数据库的order表和order detail表为例子，实现这样的应用，当在gridview展示的所有订单中，当点选某一具体的订单，可以在右侧显示该订单的详细具体信息。

　　步骤和上例子十分类似，先添加一个sqldatasource控件，命名为ordersDataSource,绑定到northwind数据库的orders表，只需要选择orderid,company,orderdate三个字段就可以了，然后添加一个gridview控件，选择控件右上角的"smart tag＂智能标记，在弹出的菜单中，设置gridview控件为＂enable paging"和"enable selection",即表示可以允许gridview分页和允许选择gridview中的每一行。

　　接着选择＂smart tag＂标记，在弹出的菜单中选择＂edit columns＂，对每一列进行具体设置，如下图，添加一个select类型的command field类型的字段，并设置其selecttext属性为＂显示订单详细信息",


　　接下来，将该gridview控件绑定到ordersDataSource中去．再添加另外一个sqldatasource控件，命名为orderDetailsDataSource,按上文提到的方法，将其绑定到order detail表中，并且设置其where子句，通过order id,与order表中的orderid进行连接．这些可以通过菜单进行设置，如下图所示：
　

　　最后，可以运行程序了．结果如下两图所示：
　　

　　可以清楚的看到，当选择左边的gridview的每一行时，如果点了＂显示订单信息＂的话，就会在右边显示这张订单的详细信息。

　　此外，为了能使gridview能分页，则添加如下代码：

void orderGridView_PageIndexChanged(object sender, EventArgs e) { 　orderGridView.SelectedIndex = -1; }

　　完整的代码如下：

＜form id="form1" runat="server"＞ 　＜div style="width:50%;float:left;padding-right:10px;"＞ 　＜h2＞Select an Order from the Left...＜/h2＞ 　＜asp:SqlDataSource ID="ordersDataSource" Runat="server" 　　SelectCommand="SELECT dbo.Orders.OrderID, 　　dbo.Customers.CompanyName, dbo.Orders.OrderDate FROM 　　dbo.Orders INNER JOIN dbo.Customers ON dbo.Orders.CustomerID = dbo.Customers.CustomerID" 　　ConnectionString= 　　　　"＜%$ ConnectionStrings:NWConnectionString %＞"＞ 　＜/asp:SqlDataSource＞ 　＜asp:GridView ID="orderGridView" Runat="server" 　　DataSourceID="ordersDataSource" DataKeyNames="OrderID" 　　AutoGenerateColumns="False" AllowPaging="True" 　　BorderWidth="1px" BackColor="#DEBA84" 　　CellPadding="3" CellSpacing="2" BorderStyle="None" 　　BorderColor="#DEBA84" 　　OnPageIndexChanged="orderGridView_PageIndexChanged"＞ 　＜FooterStyle ForeColor="#8C4510" 　　BackColor="#F7DFB5"＞＜/FooterStyle＞ 　　＜PagerStyle ForeColor="#8C4510" 　　　HorizontalAlign="Center"＞＜/PagerStyle＞ 　　＜HeaderStyle ForeColor="White" Font-Bold="True" 　　　BackColor="#A55129"＞＜/HeaderStyle＞ 　＜Columns＞ 　　＜asp:CommandField ShowSelectButton="True" 　　　　SelectText="View Order Details"＞＜/asp:CommandField＞ 　　＜asp:BoundField HeaderText="Company" 　　　　DataField="CompanyName" 　　　　SortExpression="CompanyName"＞＜/asp:BoundField＞ 　　＜asp:BoundField HeaderText="Order Date" 　　　　DataField="OrderDate" SortExpression="OrderDate" 　　　　DataFormatString="{0:d}"＞ 　　　＜ItemStyle HorizontalAlign="Right"＞＜/ItemStyle＞ 　　＜/asp:BoundField＞ 　＜/Columns＞ 　＜SelectedRowStyle ForeColor="White" Font-Bold="True" 　　　BackColor="#738A9C"＞＜/SelectedRowStyle＞ 　　＜RowStyle ForeColor="#8C4510" BackColor="#FFF7E7"＞＜/RowStyle＞ 　＜/asp:GridView＞ ＜/div＞ ＜div＞ ＜h2＞... and View the Order Details on the Right＜/h2＞ ＜asp:SqlDataSource ID="orderDetailsDataSource" Runat="server" 　SelectCommand="SELECT dbo.[Order Details].OrderID, 　dbo.Products.ProductName, dbo.[Order Details].UnitPrice, 　dbo.[Order Details].Quantity, dbo.[Order Details].Discount 　FROM dbo.[Order Details] INNER JOIN dbo.Products 　ON dbo.[Order Details].ProductID = dbo.Products.ProductID 　WHERE dbo.[Order Details].OrderID = @OrderID" 　ConnectionString="＜%$ ConnectionStrings:NWConnectionString %＞"＞ ＜SelectParameters＞ 　＜asp:ControlParameter ControlID="orderGridView" 　　Name="OrderID" Type="Int32" 　　PropertyName="SelectedValue" /＞ ＜/SelectParameters＞ ＜/asp:SqlDataSource＞ ＜asp:GridView ID="detailsGridView" Runat="server" 　DataSourceID="orderDetailsDataSource" 　AutoGenerateColumns="False" BorderWidth="1px" 　BackColor="#DEBA84" CellPadding="3" 　CellSpacing="2" BorderStyle="None" BorderColor="#DEBA84"＞ 　＜FooterStyle ForeColor="#8C4510" BackColor="#F7DFB5"＞＜/FooterStyle＞ 　＜PagerStyle ForeColor="#8C4510" HorizontalAlign="Center"＞＜/PagerStyle＞ 　＜HeaderStyle ForeColor="White" Font-Bold="True" BackColor="#A55129"＞＜/HeaderStyle＞ 　＜Columns＞ ＜asp:BoundField HeaderText="Product" 　DataField="ProductName" 　SortExpression="ProductName"＞＜/asp:BoundField＞ ＜asp:BoundField HeaderText="Unit Price" 　DataField="UnitPrice" SortExpression="UnitPrice" 　DataFormatString="{0:c}"＞ 　＜ItemStyle HorizontalAlign="Right"＞＜/ItemStyle＞ ＜/asp:BoundField＞ ＜asp:BoundField HeaderText="Quantity" 　DataField="Quantity" SortExpression="Quantity"＞ 　＜ItemStyle HorizontalAlign="Right"＞＜/ItemStyle＞ ＜/asp:BoundField＞ ＜asp:BoundField HeaderText="Discount" 　DataField="Discount" SortExpression="Discount" 　DataFormatString="{0:P}"＞ ＜ItemStyle HorizontalAlign="Right"＞＜/ItemStyle＞ ＜/asp:BoundField＞ ＜/Columns＞ ＜SelectedRowStyle ForeColor="White" Font-Bold="True" 　BackColor="#738A9C"＞＜/SelectedRowStyle＞ ＜RowStyle ForeColor="#8C4510" BackColor="#FFF7E7"＞＜/RowStyle＞ ＜/asp:GridView＞ ＜/div＞ ＜/form＞

查看本文来源