Use the DataGrid control to implement the primary table

In the template column of the DataGrid control, you can specify the control to be displayed in the column. The template column supports four items: Header, footer, item, and edit item.

First, add the template column in The DataGrid:
(1) In the design view, select the DataGrid Control and click the "Property generator" link at the bottom of the "properties" window.
(2) In "available columns", select "template column" and click "add. Click OK.
(3) In the View window, right-click the DataGrid Control, select the "Edit template" menu item from the pop-up menu, and select the created template column.
(5) You can edit four template columns. Add the control to the template column as needed and add a DataGrid Control to the template column of the item, right-click the DataGrid and choose "End template edit" from the shortcut menu.

Displaying Data with primary and secondary structures is mainly created through the datarelation class. This class can specify the name, parent level, and sub-level datacolumn object to indicate whether to create constraints.

The DataGrid Control page is added to the template column of the DataGrid Control.Code:

<Form ID = "form1" method = "Post" runat = "server">
<Asp: DataGrid id = "dgmaster" style = "Z-INDEX: 101; left: 48px; position: absolute; top: 64px" runat = "server"
Autogeneratecolumns = "false" showheader = "false" width = "432px" Height = "96px">
<Columns>
<Asp: templatecolumn>
<Itemtemplate>
<Table cellspacing = "0" cellpadding = "0" width = "100%" border = "0">
<Tr>
<TD bgcolor = "# cccccc"> <font color = "# ffffff"> <B> Order No:
<% # Databinder. eval (container. dataitem, "orderid") %>
</B> </font>
</TD>
</Tr>
<Tr>
<TD align = "right">
<Asp: dataGrid id = dgdetail runat = "server" bordercolor = "#336666" borderstyle = "double" borderwidth = "3px" backcolor = "white" cellpadding = "4" gridlines = "horizontal" autogeneratecolumns = "false" width = "100%" datakeyfield = "orderid" datasource = '<% # (system. data. datarowview) container. dataitem ). createchildview ("tablerelation") %> 'font-size = "smaller">
<Selecteditemstyle font-bold = "true" forecolor = "white" backcolor = "#339966"> </selecteditemstyle>
<Itemstyle forecolor = "#333333" backcolor = "white"> </itemstyle>
<Headerstyle font-bold = "true" forecolor = "white" backcolor = "#336666"> <Footerstyle forecolor = "#333333" backcolor = "white"> </footerstyle>
<Columns>
<Asp: boundcolumn visible = "false" datafield = "orderid" readonly = "true"> </ASP: boundcolumn>
<Asp: templatecolumn headertext = "Product Name">
<Headerstyle width = "250px"> <Itemtemplate>
<% # Databinder. eval (container. dataitem, "productname") %>
</Itemtemplate>
</ASP: templatecolumn>
<Asp: boundcolumn datafield = "unitprice" headertext = "unit price" dataformatstring = "{0: c}"> </ASP: boundcolumn>
<Asp: boundcolumn datafield = "quantity" headertext = "quantity"> </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>
<P> <font face = ""> & nbsp; & nbsp;
</Font> <a href = "webform1.aspx"> <font face = ""> webform1 </font> </a> </P>
<P> <font face = ""> & nbsp; </font> <font face = ""> </font> </P>
<P> <font face = ""> </font> & nbsp; </P>
<P> <font face = ""> </font> & nbsp; </P>
<P> <font face = ""> & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; </font> </P>
</Form>

Background code:
To create a parent table template column and embed another DataGrid into this template column, the parent-level DataGrid is used to display the master record, and the Child-level DataGrid is used to display details. The following describes how to dynamically specify a data source for the Child DataGrid.

Datasource ='<%#(System. Data. datarowview) container. dataitem). createchildview ('tablerelation ')%>'

Page loading events
Private void page_load (Object sender, system. eventargs E)
{
// Place user code here to initialize the page
If (! Ispostback)
{
This. Maid ();
}
}

Data Binding method

Private void datagridbind ()
{
// Define the database connection object. The database connection string is defined in the web. config file.
Sqlconnection conn = new sqlconnection (configurationsettings. etettings ["connectionsqlserver"]. tostring ());
// Create a data adapter object
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 DS = new dataset ();

Try
{
// Fill the dataset
Da. Fill (DS );
// Set the table name
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 );
// Bind data
Dgmaster. datasource = Ds. Tables ["orders"]. defaultview;
Dgmaster. databind ();
}
Catch (Exception error)
{
Response. Write (error. tostring ());
}
}
Running results: