Marius Vasile

Marius Vasile

  • 592
  • 1.9k
  • 145.4k

Three level bootstrap accordion from Datalist

Nov 10 2024 7:38 AM

Hi, I am trying to build a 3-lvl accordion bootstrap and bind data to Datalist with

 

<asp:DataList ID="DataList1" runat="server" Style="width: 100%" OnItemCommand="DataList1_ItemCommand" DataKeyField="IdOB">
    <ItemTemplate>
        <div class="accordion" id="accordionExample">
            <div class="card">
                <div class="card-header" id="headingOne">
                    <h2 class="mb-0">
                        <asp:TextBox ID="txtIDOB" class="hidden" runat="server" Text='<%#DataBinder.Eval(Container.DataItem,"IdOB")%>' />
                        <asp:LinkButton ID="LinkButton10" runat="server" Text='<%#Eval("Obiectiv")%>' CommandName="Obiectiv" UseSubmitBehavior="false" Style="font-size: 11px;" class="form-control form-control-sm" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne" />
                    </h2>
                </div>

                <div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordionExample">
                    <asp:DataList ID="DataList2" runat="server" Style="width: 100%" OnItemCommand="DataList2_ItemCommand" DataKeyField="IdCL">
                        <ItemTemplate>
                            <div class="card-body">
                                <asp:TextBox ID="txtIDCL" class="hidden" runat="server" Text='<%#DataBinder.Eval(Container.DataItem,"IdCL")%>' />
                                <asp:LinkButton ID="LinkButton11" runat="server" Text='<%#Eval("Cladire")%>' CommandName="Cladire" UseSubmitBehavior="false" Style="font-size: 11px;" class="form-control form-control-sm" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="true" aria-controls="collapseTwo" />
                            </div>
                        </ItemTemplate>
                    </asp:DataList>
                </div>

                <div id="collapseTwo" class="collapse show" aria-labelledby="collapseOne" data-parent="#accordionExample">
                    <asp:DataList ID="DataList3" runat="server" Style="width: 100%" OnItemCommand="DataList3_ItemCommand" DataKeyField="IdCA">
                        <ItemTemplate>
                            <div class="card-body">
                                <asp:TextBox ID="txtIDCA" class="hidden" runat="server" Text='<%#DataBinder.Eval(Container.DataItem,"IdCA")%>' />
                                <asp:LinkButton ID="LinkButton11" runat="server" Text='<%#Eval("Camera")%>' CommandName="Camera" UseSubmitBehavior="false" Style="font-size: 11px;" class="form-control form-control-sm" data-toggle="collapse" data-target="#collapseThree" aria-expanded="true" aria-controls="collapseThree" />
                            </div>
                        </ItemTemplate>
                    </asp:DataList>
                </div>
            </div>
    </ItemTemplate>
</asp:DataList>

 

Code behind

protected void GetData()
{
    using (SqlConnection conn = new SqlConnection(connString))
    {
        string sqlQuery = "SELECT DISTINCT IdOB,Obiectiv FROM tblObiectiv ORDER BY Obiectiv";
        using (SqlCommand cmd = new SqlCommand(sqlQuery, conn))
        {
            cmd.CommandType = CommandType.Text;

            SqlDataAdapter da = new SqlDataAdapter(cmd);
            conn.Open();
            DataSet ds = new DataSet();
            da.Fill(ds);
            DataList1.DataSource = ds.Tables[0];
            DataList1.DataBind();
            conn.Close();
        }
    }
}
private static DataTable GetDataTable(string query)
{
    string constr = ConfigurationManager.ConnectionStrings["ConnString"].ConnectionString;
    using (SqlConnection conn = new SqlConnection(constr))
    {
        using (SqlCommand cmd = new SqlCommand())
        {
            cmd.CommandText = query;
            using (SqlDataAdapter sda = new SqlDataAdapter())
            {
                cmd.Connection = conn;
                sda.SelectCommand = cmd;
                using (DataSet ds = new DataSet())
                {
                    DataTable dt = new DataTable();
                    sda.Fill(dt);
                    return dt;
                }
            }
        }
    }
}
protected void DataList1_ItemCommand(Object source, DataListCommandEventArgs e)
{
    if (e.CommandName == "Obiectiv" && e.Item.ItemType == ListItemType.Item)

    {
        int idob = Convert.ToInt32(DataList1.DataKeys[e.Item.ItemIndex].ToString());
        DataRowView drv = e.Item.DataItem as DataRowView;
        DataList innerDataList = e.Item.FindControl("DataList2") as DataList;
        innerDataList.DataSource = GetDataTable("SELECT DISTINCT IdCL,Cladire FROM tblCladire WHERE IdOB ='" + idob + "'");
        innerDataList.DataBind();

    }

}
protected void DataList2_ItemCommand(Object source, DataListCommandEventArgs e)
{
    if (e.CommandName == "Cladire" && e.Item.ItemType == ListItemType.Item)

    {
        
        DataRowView drv = e.Item.DataItem as DataRowView;
        DataList secondDataList = e.Item.FindControl("DataList2") as DataList;
        int idcl = Convert.ToInt32(secondDataList.DataKeys[e.Item.ItemIndex].ToString());
        secondDataList.DataSource = GetDataTable("SELECT DISTINCT IdCA,Camera FROM tblCladire WHERE IdCL ='" + idcl + "'");
        secondDataList.DataBind();

    }
}

but I only get data for "Obiectiv" but not the other lvls. No error also, how it should be done?

 


Answers (1)