Nested DataList to show Master/Details relationship in ASP.NET 2.0

[]

This will help you to nest grdiviews inside ASP.NET. There may be many ways to do this, but this is my way( May is not the best, let me know if you have any other

  1. First, drop a DataList to the page, also set its DataKeyNames to your primary key

  2. Add a new template column to this DataList

  3. Place another DataList this template column.

<%@ Page Language="C#" %>

<%@ Import Namespace="System.Data" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">
 private DataSet CreateDS()
 {
     DataSet ds = new DataSet();
     if (Session["dsEvents"] == null)
     {
         DataTable dt = new DataTable("PersonData");
         DataRow dr;
         dt.Columns.Add(new DataColumn("Person_ID", typeof(Int32)));
         dt.Columns.Add(new DataColumn("PersonName", typeof(string)));
         dt.Columns.Add(new DataColumn("Company", typeof(string)));
         for (int i = 1; i < 10; i++)
         {
             dr = dt.NewRow();
             dr[0] = i;
             dr[1] = "Person " + i;
             dr[2] = "Company " + i;
             dt.Rows.Add(dr);
         }
         DataColumn parentCol;
         parentCol = dt.Columns["Person_ID"];

         ds.Tables.Add(dt);
         DataColumn[] PrimaryKeyColumns = new DataColumn[1];
         PrimaryKeyColumns[0] = dt.Columns["Person_Id"];
         dt.PrimaryKey = PrimaryKeyColumns;

         dt = new DataTable("Orders");
         dt.Columns.Add(new DataColumn("PrimaryKey", typeof(Int32)));
         dt.Columns.Add(new DataColumn("ForeignKey", typeof(Int32)));
         dt.Columns.Add(new DataColumn("Order", typeof(string)));
         for (int i = 1; i < 60; i++)
         {
             dr = dt.NewRow();
             dr[0] = i;
             dr[1] = 1 + i % 9;
             dr[2] = "Order # " + i;
             dt.Rows.Add(dr);
         }
         ds.Tables.Add(dt);

         DataColumn childCol;
         childCol = dt.Columns["ForeignKey"];
         DataRelation relation1;
         relation1 = new DataRelation("CustomersOrders", parentCol, childCol);
         // Add the relation to the DataSet.
         ds.Relations.Add(relation1);

         Session["dsEvents"] = ds;
     }
     else
     {
         ds = (DataSet)Session["dsEvents"];
     }
     return ds;

 }
 protected DataView Function(int pid)
 {

     DataView dv = new DataView(CreateDS().Tables[1]);
     dv.RowFilter = "ForeignKey=" + pid;
     return dv;
 }

 protected void Page_Load(object sender, EventArgs e)
 {
     if (!IsPostBack)
     {

         DataList1.DataSource = CreateDS();
         DataList1.DataBind();

     }

 }
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
 <title>Untitled Page</title>
</head>
<body>
 <form id="form1" runat="server">
     <div>
         <asp:DataList ID="DataList1" runat="server" Width="100%">
             <ItemTemplate>
                 <asp:LinkButton ID="lbtnTeamPage" runat="server" CommandArgument='<%#Eval("Person_ID") %>'
                     ForeColor="Black" Font-Underline="True" Text='<%#Eval("Person_ID")%>' />
                 <asp:DataList ID="DataList2" runat="server" Width="100%" DataSource='<%#Function(Convert.ToInt32(Eval("Person_ID")))%>'>
                     <ItemTemplate>
                         <asp:LinkButton ID="Lnk1" runat="server" Font-Underline="True" ForeColor="Black"
                             Text='<%#Eval("Order")%>' />
                     </ItemTemplate>
                 </asp:DataList>
             </ItemTemplate>
         </asp:DataList>
     </div>
 </form>
</body>
</html>

This child DataList has to show the content based on the primary of the row thats binded to main DataList . Here in my case “pId” is the primary key. The nesting happens here

<asp:DataList ID="DataList2" runat="server" Width="100%" DataSource='<%#Function(Convert.ToInt32(Eval("Person_ID")))%>'>

What I have done is that I have called function “Function” and passed the primary key to that function. This function will return a data table. So each time a row is bound to the main DataList, the child DataList also bound with the corresponding values. The functions is like this protected DataView Function(int PID) { return }

Reactions

Post a Comment

3 Comments

  1. After clicking the grid,i cannot see child grid

    ReplyDelete
  2. BEAUTIFUL ARTICLE. ALL IN VERY SHORT CODE...THANKS A LOT

    ReplyDelete
  3. Very good article in short code.
    Very useful for me.
    Thanks a lot.

    ReplyDelete

Please do not post any spam link in the comment box😊

Emoji
(y)
:)
:(
hihi
:-)
:D
=D
:-d
;(
;-(
@-)
:P
:o
:>)
(o)
:p
(p)
:-s
(m)
8-)
:-t
:-b
b-(
:-#
=p~
x-)
(k)

Close Menu