ASP.NET: Dynamically creating controls

You could use the following approach (if you do not feel comfortable building a more complex UI with javascript).

It works by dynamically creating the attribute DropDownLists when the page loads (you would implement it based on the result of a DB query) and hiding each one, ready for display later on.

Upon the selection of a category the correct DropDownLists would then be made visible (again a query here could determine which attribute DropDownLists become visible).

Obviously it will require some modifications to probably generate a Panel which contains each DropDownList and a Label control, instead of just creating a number of DropDownLists.

You would then show/hide the Panel instead of the DropDownList, but hopefully it points you in the right direction.

Hope this helps.

Markup

<style type="text/css">
    select
    {
        display:block;
        margin-top:10px;
    }
</style>

....

<asp:ScriptManager ID="scriptManager" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="updatePanel" runat="server" UpdateMode="Conditional">
    <ContentTemplate>

        <!-- Category selection -->
        <asp:DropDownList ID="categoryDropDownList" runat="server" AutoPostBack="true" OnSelectedIndexChanged="categoryDropDownList_SelectedIndexChanged">
            <asp:ListItem Text="Please select a category" Value="0"></asp:ListItem>
        </asp:DropDownList>

        <br />

        <!-- Used to store the drop downs -->
        <asp:Panel ID="dropDownContainer" runat="server"></asp:Panel>

    </ContentTemplate>
</asp:UpdatePanel>

Code

protected void Page_Load(object sender, EventArgs e)
{
    LoadDropDownLists();
}

private void LoadDropDownLists()
{
    //Dummy data, you would pull your categories/attributes from whichever datasource
    //you are using
    var categories = new[]{
        new { Name = "Category 1", Id = 1, Attributes = new string[]{"GA", "FA", "RA"} },
        new { Name = "Category 2", Id = 2, Attributes = new string[]{"GA", "NA"} }
    };

    //Loop through the categories, load the dropdown
    foreach (var category in categories)
    {
        if (!IsPostBack)
            categoryDropDownList.Items.Add(new ListItem(category.Name, category.Id.ToString()));

        //For each attribute create a drop down and populate with data as required
        foreach (var attribute in category.Attributes)
        {
            string dropDownListId = FormatDropDownListId(attribute);
            if (!DropDownListExists(dropDownListId))
            {
                DropDownList dropDownList = new DropDownList();
                dropDownList.ID = dropDownListId;
                dropDownList.Visible = false;

                dropDownList.Items.Add(new ListItem(attribute));

                dropDownContainer.Controls.Add(dropDownList);
            }
        }
    }
}

private bool DropDownListExists(string id)
{
    DropDownList dropDownList = (DropDownList)dropDownContainer.FindControl(id);
    return dropDownList != null;
}

protected void categoryDropDownList_SelectedIndexChanged(object sender, EventArgs e)
{
    //Reset all visible dropdowns
    HideAllDropDownLists();

    //Get the selected category
    string selectedItem = categoryDropDownList.SelectedItem.Value;
    switch (selectedItem)
    {
        case "1":
            {
                //Here you would connect to db and pull correct attributes
                //then set the visible dropdowns as required
                SetDropDownVisibility(FormatDropDownListId("GA"));
                SetDropDownVisibility(FormatDropDownListId("FA"));
                SetDropDownVisibility(FormatDropDownListId("RA"));
            } break;
        case "2":
            {
                SetDropDownVisibility(FormatDropDownListId("GA"));
                SetDropDownVisibility(FormatDropDownListId("NA"));
            } break;
    }
}

private void SetDropDownVisibility(string id)
{
    DropDownList dropDownList = (DropDownList)dropDownContainer.FindControl(id);
    if(dropDownList != null)
        dropDownList.Visible = true;
}

private void HideAllDropDownLists()
{
    foreach (Control control in dropDownContainer.Controls)
    {
        control.Visible = false;
    }
}

private string FormatDropDownListId(string id)
{
    return string.Format("dropDown{0}", id);
}

If you're using ASP.NET webforms then I don't believe you need to use AJAX or JavaScript.

I would do the following

1. Set autopostback = true on your combobox
2. Add an event handler for the OnChanged event of the combobox
3. Inside the event handler, apply rules at to load / generate / populate child comboboxes
4. Add those combo boxes to the form

You can either hide the comboboxes (as I see in @jdavies answer), or start without any and dynamically create & add them to the form.

This question deals with the same issue:

DropDownList and Update Panel