图1.使用DataList显示主从表明细
图2.使用Gridview显示主从表明细
数据库为SQL Server实例数据库Northwind，实现按照订单编号，统计显示出订单详情。
一构建Northwind库中Orders订单表以及Order Details订单详细表在DataSet中的表关系：
public class DataAccess{
public DataSet Tablerelation()
{
string strCon = ConfigurationManager.ConnectionStrings["NorthwindConnectionString"].ConnectionString;
//构建连接
SqlConnection con = new SqlConnection(strCon);
//多个表来源于相同数据库我们可以讲sql语句一起书写，但需要注意的是，必须在语句间用空格隔开
SqlDataAdapter da = new SqlDataAdapter("select * from orders select * from [order details]",con);
DataSet ds = new DataSet();
da.Fill(ds);
//我们也可以修改默认生成的（Table、Table1、……）表名
ds.Tables [0].TableName="orders";
ds.Tables[1].TableName = "orderDetails";
//找到两个表中相关联的列
DataColumn father = ds.Tables["orders"].Columns["OrderID"];
DataColumn son = ds.Tables["orderDetails"].Columns["OrderID"];
//给两个列，建立名为tablerelation的关系
DataRelation r = new DataRelation("tablerelation", father, son);
//将表关系添加到数据集中
ds.Relations.Add(r);
return ds;
}
}
{ string strCon = ConfigurationManager.ConnectionStrings["NorthwindConnectionString"].ConnectionString; //构建连接 SqlConnection con = new SqlConnection(strCon); //多个表来源于相同数据库我们可以讲sql语句一起书写，但需要注意的是，必须在语句间用空格隔开 SqlDataAdapter da = new SqlDataAdapter("select * from orders select * from [order details]",con); DataSet ds = new DataSet(); da.Fill(ds); //我们也可以修改默认生成的（Table、Table1、……）表名 ds.Tables [0].TableName="orders"; ds.Tables[1].TableName = "orderDetails"; //找到两个表中相关联的列 DataColumn father = ds.Tables["orders"].Columns["OrderID"]; DataColumn son = ds.Tables["orderDetails"].Columns["OrderID"]; //给两个列，建立名为tablerelation的关系 DataRelation r = new DataRelation("tablerelation", father, son); //将表关系添加到数据集中 ds.Relations.Add(r); return ds; } }
wef.config中的连接字符串为：
<connectionStrings> <add name="NorthwindConnectionString" connectionString="Data Source=.;Initial Catalog=Northwind;Integrated Security=True" providerName="System.Data.SqlClient"/> </connectionStrings>接下来我们来布置控件的界面：
一DataList:
给DataList1的项中添加一个一行二列的表，第一个单元格中绑定订单编号，第二个单元格中再加入一个DataList2作为此订单编号的订单详细，在DataList2的项中添加一个一行四列的表，单元格中绑定订单详细表中的字段名。给DataList1的头模版中加入一个一行五列的表，分别写入图片所示的列说明，布局源码如下：
<asp:DataList ID="DataList1" runat="server" BackColor="White" BorderColor="#CCCCCC" BorderStyle="None" BorderWidth="1px" CellPadding="3" GridLines="Both"> <ItemStyle ForeColor="#000066" /> <SelectedItemStyle BackColor="#669999" Font-Bold="True" ForeColor="White" /> <HeaderTemplate> <table class="style1" > <tr> <td width="70"> 订单编号</td> <td width="70"> 商品编号</td> <td width="70"> 单价</td> <td width="70"> 数量</td> <td width="70"> 折扣</td> </tr> </table> </HeaderTemplate> <FooterStyle BackColor="White" ForeColor="#000066" /> <ItemTemplate> <table class="style1"> <tr> <td width="70"> <%#Eval("OrderID") %></td> <td> <asp:DataList ID="DataList2" runat="server" DataSource ='<%# ((System.Data.DataRowView)Container.DataItem).CreateChildView("tablerelation") %>' Width ="100%" BackColor="White" BorderColor="#CC9966" BorderStyle="None" BorderWidth="1px" CellPadding="4" GridLines="Both"> <FooterStyle BackColor="#FFFFCC" ForeColor="#330099" /> <ItemTemplate> <table class="style1"> <tr> <td width="70"> <%#Eval("productID") %></td> <td width="70"> <%#Eval("Unitprice") %></td> <td width="70"> <%#Eval("Quantity") %></td> <td width="70"> <%#Eval("Discount") %></td> </tr> </table> </ItemTemplate> <ItemStyle BackColor="White" ForeColor="#330099" /> <SelectedItemStyle BackColor="#CC3333" Font-Bold="True" ForeColor="White" /> <HeaderStyle BackColor="#990000" Font-Bold="True" ForeColor="#FFFFCC" /> </asp:DataList> </td> </tr> </table> </ItemTemplate> <HeaderStyle BackColor="#006699" Font-Bold="True" ForeColor="White" /> </asp:DataList> 其中用×××背景加粗显示的为DataList2的数据源将是根据该项中的订单编号，在表关系名“tablerelation”中找到对应的订单详情，创建一个视图。
DataList1的数据源将绑定我们以及构建好的DataSet，代码如下：
protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { Bind(); } } //绑定控件显示 void Bind() { DataAccess da = new DataAccess(); DataSet ds = da.Tablerelation(); DataList1.DataSource = ds.Tables[0]; DataList1.DataBind(); GridView2.DataSource = ds.Tables[0]; GridView2.DataBind(); }二、使用Gridview的方式类似，首先将Gridview2的自动生成列AutoGenerateColumns="False"改为false，然后在Gridview2手动加入自定义项TemplateField中编辑模版，加入二行一列的表格，第一行绑定订单编号，第二行加入Gridview3，用于显示订单明细，自动生成列AutoGenerateColumns="False"改为false,加入自定义绑定的四个项目，如 <asp:BoundField DataField="productID" HeaderText="商品编号" />，源码如下：
<asp:GridView ID="GridView2" runat="server" AutoGenerateColumns="False" CellPadding="4" ForeColor="#333333" GridLines="None" > <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" /> <RowStyle BackColor="#F7F6F3" ForeColor="#333333" /> <Columns> <asp:TemplateField> <ItemTemplate> <table class="style1"> <tr> <td> 订单编号： <%#Eval("OrderID") %></td> </tr> <tr> <td> <asp:GridView ID="GridView3" runat="server" DataSource ='<%# ((System.Data.DataRowView)Container.DataItem).CreateChildView("order") %>' DataMember="orderID" AutoGenerateColumns="False"> <Columns> <asp:BoundField DataField="productID" HeaderText="商品编号" /> <asp:BoundField DataField="Unitprice" HeaderText="商品单价" /> <asp:BoundField DataField="Quantity" HeaderText="商品数量" /> <asp:BoundField DataField="Discount" HeaderText="折扣" /> </Columns> </asp:GridView> </td> </tr> </table> </ItemTemplate> </asp:TemplateField> </Columns> <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" /> <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" /> <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" /> <EditRowStyle BackColor="#999999" /> <AlternatingRowStyle BackColor="White" ForeColor="#284775" /> </asp:GridView>
