locked
Drop Down List Selection based result RRS feed

  • Question

  • User-2055741253 posted

    Hello I have two drop downs listed below Tab and Section. I would like the available selections for Section ddl based on Tab Name drop down list.

    For example

    If users select Watch List they should only see Performance and Compliance in Section Drop Down List.

    If Users select General, Planning or CAB they should only see Main in Section Drop Down List.

    Tab Name Drop Down List:

    <asp:DropDownList ID="drpDownTabName" runat="server" Width="180px" AutoPostBack="True" OnSelectedIndexChanged="drpDownTabName_SelectedIndexChanged">
                            <asp:ListItem Text= "Select tab name" Value="-1"/>
                            <asp:ListItem>Watch List</asp:ListItem>
                            <asp:ListItem>General Stats</asp:ListItem>
                            <asp:ListItem>Planning</asp:ListItem>
                            <asp:ListItem>CAB</asp:ListItem>
                        </asp:DropDownList>

    Section Drop Down List:

    <asp:DropDownList ID="drpDownSectionName" runat="server" Width="180px" AutoPostBack="True">
                            <asp:ListItem Text= "Select section name" Value="-1"/>
                            <asp:ListItem Text="Compliance" Value="Complicance" />
                            <asp:ListItem Text="Performance" Value="Performance" />
                            <asp:ListItem Text ="Main" Value="Main" />
                        </asp:DropDownList>

    Thursday, August 10, 2017 10:52 PM

Answers

  • User2103319870 posted

    gssingh04

    would like the available selections for Section ddl based on Tab Name drop down list.

    The concept you are trying to implement is cascading dropdownlists.

    You can try with the below code

    HTML

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
            <div>
                Tab Name<br />
                <asp:DropDownList ID="drpDownTabName" runat="server" Width="180px" AutoPostBack="True" OnSelectedIndexChanged="drpDownTabName_SelectedIndexChanged">
                    <asp:ListItem Text="Select tab name" Value="-1" />
                    <asp:ListItem>Watch List</asp:ListItem>
                    <asp:ListItem>General Stats</asp:ListItem>
                    <asp:ListItem>Planning</asp:ListItem>
                    <asp:ListItem>CAB</asp:ListItem>
                </asp:DropDownList>
                <br />
                Section<br />
                <asp:DropDownList ID="drpDownSectionName" runat="server" Width="180px" AutoPostBack="True">
                    <asp:ListItem Text="Select section name" Value="-1" />
                    <asp:ListItem Text="Compliance" Value="Complicance" />
                    <asp:ListItem Text="Performance" Value="Performance" />
                    <asp:ListItem Text="Main" Value="Main" />
                </asp:DropDownList>
            </div>
        </form>
    </body>
    </html>

    C#:

     protected void drpDownTabName_SelectedIndexChanged(object sender, EventArgs e)
            {
                // Here you need to add the logic to add the values from your database bases on the drpCountry dropdown to drpState dropdownlist
                drpDownSectionName.Items.Clear();
    
                if (drpDownTabName.SelectedItem.Text == "Watch List")
                {
                    drpDownSectionName.Items.Add(new ListItem("Compliance", "Compliance"));
                    drpDownSectionName.Items.Add(new ListItem("Performance", "Performance"));
                }
                else if ((drpDownTabName.SelectedValue == "General Stats") || (drpDownTabName.SelectedValue == "Planning") || (drpDownTabName.SelectedValue == "CAB"))
                {
                    drpDownSectionName.Items.Add(new ListItem("Main", "Main"));
                }
            }

    Demo

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, August 11, 2017 12:55 AM