Populate (Bind) Nested DataList using C# and VB.Net in ASP.Net

Last Reply 17 days ago By pandeyism

Posted 17 days ago

I am trying to show Product Category and sub category wise to the users . I tried to nest the datalist but It is not giving correct output .

I want to implement like in first datalist Category name should be shown and in nested datalist all subcategory of particular category should be shown to users so that user can click and get the results.

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <div style="margin-left: 30%">
        <asp:DataList ID="DataList1" runat="server"  RepeatColumns="3" RepeatDirection="Horizontal" OnItemCommand="DataList1_ItemCommand" Width="600px" OnItemDataBound="DataList1_ItemDataBound">
                <ItemTemplate >
                    <table class="auto-style1" border="1">
                        <tr>
                            <td class="auto-style3">
                            </td>
                            <tr>
                                <td class="auto-style2">
                                    <asp:Label ID="lblid" runat="server" Font-Bold="True" Text='<%# Eval("Id") %>' Visible="false"></asp:Label>
                                </td>
                            </tr>
                            <tr>
                                <td class="auto-style2">
                                    <asp:Label ID="category" runat="server" Font-Bold="True" Text='<%# Eval("Category") %>' CssClass="btn-lg"></asp:Label>
                                </td>
                            </tr>
                            <tr>
                                <td class="auto-style2">

                                    <asp:DataList ID="DataList2" runat="server" DataSourceID="SqlDataSource1">
                                        <ItemTemplate>
                                            <table class="auto-style1" border="1">
                                                <tr>
                                                    <td class="auto-style3"></td>
                                                    <tr>
                                                        <td class="auto-style2">
                                                            <asp:Label ID="id" runat="server" Font-Bold="True" Text='<%# Eval("Id") %>' Visible="false"></asp:Label>
                                                        </td>
                                                    </tr>
                                                <tr>
                                                    <td class="auto-style2">
                                                        <asp:Label ID="Bname" runat="server" Font-Bold="True" Text='<%# Eval("Sub_category") %>' CssClass="btn-lg"></asp:Label>
                                                    </td>
                                                </tr>
                                            </table>
                                        </ItemTemplate>
                                    </asp:DataList>
                                </td>
                            </tr>
                          
                            <tr>
                                <td class="auto-style2">
                                    <asp:Button ID="Button1" runat="server" CommandArgument='<%# Eval("Id") %>' CommandName="viewdetails" CssClass="btn btn-warning" Font-Bold="true" Text="View Details" />
                                </td>
                            </tr>
                        </tr>
                    </table>
                    <br />
                    <br />
                </ItemTemplate>
            </asp:DataList><br/>
            <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:Q_SS_regnConnectionString1 %>" SelectCommand="SELECT [Category],[Sub_category], [Id] FROM [Category_tbl]"></asp:SqlDataSource>
    </div>
</asp:Content>

 

 public partial class SS_SearchCategory : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                string constr = ConfigurationManager.ConnectionStrings["Q_SS_regnConnectionString1"].ConnectionString;
                SqlConnection con = new SqlConnection(constr);
                SqlCommand cmd = new SqlCommand("select * from Category_tbl", con);
                SqlDataAdapter da = new SqlDataAdapter(cmd);
                DataTable dt = new DataTable();
                da.Fill(dt);
                DataList1.DataSource = dt;
                DataList1.DataBind();
            }          
        }

        protected void DataList1_ItemDataBound(object sender, DataListItemEventArgs e)
        {
            
        }

        protected void DataList1_ItemCommand(object source, DataListCommandEventArgs e)
        {
            if (e.CommandName == "viewdetails")
            {
                Response.Redirect("JS_ViewJobDetails.aspx?Id=" + e.CommandArgument.ToString());
            }
        }
    }

 

 

You are viewing reply posted by: pandeyism 17 days ago.
Posted 17 days ago

Hi itsme,

Refer below sample.

HTML

<asp:DataList ID="DataList1" runat="server" RepeatColumns="3" RepeatDirection="Horizontal"
    OnItemCommand="DataList1_ItemCommand" Width="600px" OnItemDataBound="DataList1_ItemDataBound">
    <ItemTemplate>
        <table class="auto-style1" border="1">
            <tr>
                <tr>
                    <td class="auto-style2">
                        <asp:Label ID="lblid" runat="server" Font-Bold="True" Text='<%# Eval("Id") %>'></asp:Label>
                    </td>
                </tr>
                <tr>
                    <td class="auto-style2">
                        <asp:Label ID="category" runat="server" Font-Bold="True" Text='<%# Eval("Category") %>'
                            CssClass="btn-lg"></asp:Label>
                    </td>
                </tr>
                <tr>
                    <td class="auto-style2">
                        <asp:DataList ID="DataList2" runat="server">
                            <ItemTemplate>
                                <table class="auto-style1" border="1">
                                    <tr>
                                        <td class="auto-style2">
                                            <asp:Label ID="id" runat="server" Font-Bold="True" Text='<%# Eval("Id") %>'></asp:Label>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td class="auto-style2">
                                            <asp:Label ID="Bname" runat="server" Font-Bold="True" Text='<%# Eval("Sub_category") %>'
                                                CssClass="btn-lg"></asp:Label>
                                        </td>
                                    </tr>
                                </table>
                            </ItemTemplate>
                        </asp:DataList>
                    </td>
                </tr>
                <tr>
                    <td class="auto-style2">
                        <asp:Button ID="Button1" runat="server" CommandArgument='<%# Eval("Id") %>' CommandName="viewdetails"
                            CssClass="btn btn-warning" Font-Bold="true" Text="View Details" />
                    </td>
                </tr>
            </tr>
        </table>
    </ItemTemplate>
</asp:DataList>

Namespaces

C#

using System.Data;

VB.Net

Imports System.Data

Code

C#

protected void Page_Load(object sender, EventArgs e)
{
    if (!this.IsPostBack)
    {
        DataTable dt = new DataTable();
        dt.Columns.AddRange(new DataColumn[] { new DataColumn("Id", typeof(int)), new DataColumn("Category", typeof(string)) });
        dt.Rows.Add(1, "A");
        dt.Rows.Add(2, "B");
        dt.Rows.Add(3, "C");
        DataList1.DataSource = dt;
        DataList1.DataBind();
    }
}
protected void DataList1_ItemCommand(object source, DataListCommandEventArgs e)
{
    if (e.CommandName == "viewdetails")
    {
        ClientScript.RegisterClientScriptBlock(this.GetType(), "", "alert('" + "Id is : " + e.CommandArgument.ToString() + "')", true);
    }
}
public DataTable SubCategoryData()
{
    DataTable dt = new DataTable();
    dt.Columns.AddRange(new DataColumn[] { new DataColumn("Id", typeof(int)), new DataColumn("Sub_category", typeof(string)) });
    dt.Rows.Add(1, "a1");
    dt.Rows.Add(1, "a11");
    dt.Rows.Add(2, "b1");
    dt.Rows.Add(2, "b11");
    dt.Rows.Add(3, "c1");
    dt.Rows.Add(3, "c11");
    return dt;
}

protected void DataList1_ItemDataBound(object sender, DataListItemEventArgs e)
{
    if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
    {
        DataRowView dataRowView = e.Item.DataItem as DataRowView;
        string id = dataRowView["Id"].ToString();
        DataList subDataList = e.Item.FindControl("DataList2") as DataList;
        DataTable dt = SubCategoryData();
        DataRow[] dr = dt.Select("Id = " + id);
        subDataList.DataSource = dr.CopyToDataTable();
        subDataList.DataBind();
    }
}

VB.Net

Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load
    If Not Me.IsPostBack Then
        Dim dt As DataTable = New DataTable()
        dt.Columns.AddRange(New DataColumn() {New DataColumn("Id", GetType(Integer)), New DataColumn("Category", GetType(String))})
        dt.Rows.Add(1, "A")
        dt.Rows.Add(2, "B")
        dt.Rows.Add(3, "C")
        DataList1.DataSource = dt
        DataList1.DataBind()
    End If
End Sub

Protected Sub DataList1_ItemCommand(ByVal source As Object, ByVal e As DataListCommandEventArgs)
    If e.CommandName = "viewdetails" Then
        ClientScript.RegisterClientScriptBlock(Me.GetType(), "", "alert('" & "Id is : " & e.CommandArgument.ToString() & "')", True)
    End If
End Sub

Public Function SubCategoryData() As DataTable
    Dim dt As DataTable = New DataTable()
    dt.Columns.AddRange(New DataColumn() {New DataColumn("Id", GetType(Integer)), New DataColumn("Sub_category", GetType(String))})
    dt.Rows.Add(1, "a1")
    dt.Rows.Add(1, "a11")
    dt.Rows.Add(2, "b1")
    dt.Rows.Add(2, "b11")
    dt.Rows.Add(3, "c1")
    dt.Rows.Add(3, "c11")
    Return dt
End Function

Protected Sub DataList1_ItemDataBound(ByVal sender As Object, ByVal e As DataListItemEventArgs)
    If e.Item.ItemType = ListItemType.Item OrElse e.Item.ItemType = ListItemType.AlternatingItem Then
        Dim dataRowView As DataRowView = TryCast(e.Item.DataItem, DataRowView)
        Dim id As String = dataRowView("Id").ToString()
        Dim subDataList As DataList = TryCast(e.Item.FindControl("DataList2"), DataList)
        Dim dt As DataTable = SubCategoryData()
        Dim dr As DataRow() = dt.[Select]("Id = " & id)
        subDataList.DataSource = dr.CopyToDataTable()
        subDataList.DataBind()
    End If
End Sub

Screenshot