图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>
Gridview3的数据源的绑定方式如上原理。
本文转自叶子文文博客51CTO博客，原文链接http://blog.51cto.com/leafwf/188602如需转载请自行联系原作者
叶子文文
