实现步骤
第一,在页面上加入2个DataGrid(dgMaster,dgDetail),设置好样式;
第二,在dgMaster中添加一个模板列,并且将dgDetail加入到模板中
<
asp:DataGrid
id
="dgMaster"
style
="Z-INDEX: 101; LEFT: 48px; POSITION: absolute; TOP: 64px"
runat
="server"
AutoGenerateColumns
="False"
ShowHeader
="False"
Width
="368px"
>
<
Columns
>
<
asp:TemplateColumn
>
<
ItemTemplate
>
<
TABLE
cellSpacing
="0"
cellPadding
="0"
width
="100%"
border
="0"
>
<
TR
>
<
TD
bgColor
="#3399ff"
><
FONT
color
="#ffffff"
><
B
>
订单号:

<%
# DataBinder.Eval(Container.DataItem, "OrderID")
%>
</
B
></
FONT
>
</
TD
>
</
TR
>
<
TR
>
<
TD
align
="right"
>
<
asp:DataGrid
id
=dgDetail
runat
="server"
Width
="100%"
AutoGenerateColumns
="False"
Font-Size
="Smaller"
GridLines
="Horizontal"
CellPadding
="4"
BackColor
="White"
BorderWidth
="3px"
BorderStyle
="Double"
BorderColor
="#336666"
DataKeyField
="OrderID"
DataSource
='<%#
((System.Data.DataRowView)Container.DataItem).CreateChildView("tableRelation") %
>
'>
<
SelectedItemStyle
Font-Bold
="True"
ForeColor
="White"
BackColor
="#339966"
></
SelectedItemStyle
>
<
ItemStyle
ForeColor
="#333333"
BackColor
="White"
></
ItemStyle
>
<
HeaderStyle
Font-Bold
="True"
ForeColor
="White"
BackColor
="#336666"
></
HeaderStyle
>
<
FooterStyle
ForeColor
="#333333"
BackColor
="White"
></
FooterStyle
>
<
Columns
>
<
asp:BoundColumn
Visible
="False"
DataField
="OrderID"
ReadOnly
="True"
></
asp:BoundColumn
>
<
asp:TemplateColumn
HeaderText
="产品名称"
>
<
HeaderStyle
Width
="250px"
></
HeaderStyle
>
<
ItemTemplate
>

<%
# DataBinder.Eval(Container.DataItem, "ProductName")
%>
</
ItemTemplate
>
</
asp:TemplateColumn
>
<
asp:BoundColumn
DataField
="UnitPrice"
HeaderText
="单价"
DataFormatString
="{0:c}"
></
asp:BoundColumn
>
<
asp:BoundColumn
DataField
="Quantity"
HeaderText
="数量"
></
asp:BoundColumn
>
<
asp:BoundColumn
DataField
="Discount"
HeaderText
="折扣"
></
asp:BoundColumn
>
</
Columns
>
<
PagerStyle
HorizontalAlign
="Center"
ForeColor
="White"
BackColor
="#336666"
Mode
="NumericPages"
></
PagerStyle
>
</
asp:DataGrid
></
TD
>
</
TR
>
</
TABLE
>
</
ItemTemplate
>
</
asp:TemplateColumn
>
</
Columns
>
</
asp:DataGrid
>
第三,在添加代码
private
void
Page_Load(
object
sender, System.EventArgs e)

{
//页面初试化时进行数据绑定
if(!IsPostBack)
DataGridDataBind();
}

private
void
DataGridDataBind()

{
//定义数据连接对象,其中数据库连接字符串是在Web.Config文件中定义的
SqlConnection conn = new SqlConnection(ConfigurationSettings.AppSettings["ConnectionSqlServer"].ToString());
//创建数据适配器对象
SqlDataAdapter da = new SqlDataAdapter("Select top 5 * from Orders select OrderID ,Products.ProductName,[order Details].Unitprice,[order Details].Quantity,[order Details].discount from [order Details],Products where [Order Details].ProductId=Products.ProductID",conn);
//创建DataSet对象
DataSet ds = new DataSet();
try

{
//填充数据集
da.Fill(ds);
//设定表名字
ds.Tables[0].TableName = "Orders";
ds.Tables[1].TableName = "Order Details";
DataColumn Parent = ds.Tables["Orders"].Columns["OrderID"];
DataColumn Child = ds.Tables["Order Details"].Columns["OrderID"];
DataRelation tableRelation = new DataRelation("tableRelation", Parent, Child, false);
ds.Relations.Add(tableRelation);
//进行数据绑定
dgMaster.DataSource = ds.Tables["Orders"].DefaultView;
dgMaster.DataBind();
}
catch(Exception error)

{
Response.Write(error.ToString());
}
}