C# Multiple Cascading DropDownList

Question

User-1193791088 posted

I set up my cascading DropDownList using Select Parameters with SqlDataSource

					<div class="form-group row">
						<label class="form-control-label text-primary text-right col-md-2" >Item Category:</label>
						<asp:DropDownList ID="uiItemType" runat="server" CssClass="form-control col-md-2" DataSourceID="dsItemType" DataTextField="ItemType" DataValueField="ItemTypeId" AppendDataBoundItems="true" AutoPostBack="true" OnSelectedIndexChanged="uiItemType_SelectedIndexChanged">
							<asp:ListItem Text="----- SELECT TYPE -----" Value="-1" />
						</asp:DropDownList>
						<asp:SqlDataSource ID="dsItemType" runat="server" ConnectionString='<%$ ConnectionStrings:MySolutionsCnSt %>' SelectCommand="SELECT [ItemType], [ItemTypeId] FROM [DataCoItemTypes]"/>

						<asp:DropDownList ID="uiItemClass" runat="server" CssClass="form-control col-md-2" DataSourceID="dsItemClass" DataTextField="ItemClass" DataValueField="ItemClassId" AppendDataBoundItems="true" AutoPostBack="true" >
							<asp:ListItem Text="----- SELECT CLASS -----" Value="-1" />
						</asp:DropDownList>
						<asp:SqlDataSource ID="dsItemClass" runat="server" ConnectionString='<%$ ConnectionStrings:MySolutionsCnSt %>' SelectCommand="SELECT [ItemClassId], [ItemClass] FROM [DataCoItemClass] WHERE ([ItemTypeId] = @ItemTypeId)">
							<SelectParameters>
								<asp:ControlParameter ControlID="uiItemType" PropertyName="SelectedValue" DefaultValue="SelectedValue" Name="ItemTypeId" Type="Int32"></asp:ControlParameter>
							</SelectParameters>
						</asp:SqlDataSource>
						<asp:DropDownList ID="uiItemSubClass" runat="server" CssClass="form-control col-md-2" DataSourceID="dsItemSubClass" DataTextField="ItemSubClass" DataValueField="ItemSubClassId" AppendDataBoundItems="true" AutoPostBack="true" >
							<asp:ListItem Text="----- SELECT SUB-CLASS -----" Value="-1" />
						</asp:DropDownList>
						<asp:SqlDataSource ID="dsItemSubClass" runat="server" ConnectionString='<%$ ConnectionStrings:MySolutionsCnSt %>' SelectCommand="SELECT [ItemSubClassId], [ItemSubClass] FROM [DataCoItemClassSub] WHERE ([ItemClassId] = @ItemClassId)">
							<SelectParameters>
								<asp:ControlParameter ControlID="uiItemClass" PropertyName="SelectedValue" DefaultValue="SelectedValue" Name="ItemClassId" Type="Int32"></asp:ControlParameter>
							</SelectParameters>
						</asp:SqlDataSource>
						<asp:DropDownList ID="uiItemGroup" runat="server" CssClass="form-control col-md-2" DataSourceID="dsItemGroup" DataTextField="ItemGroup" DataValueField="ItemGroupId" AppendDataBoundItems="true" AutoPostBack="true">
							<asp:ListItem Text="----- SELECT GROUP -----" Value="-1" />
						</asp:DropDownList>
						<asp:SqlDataSource ID="dsItemGroup" runat="server" ConnectionString='<%$ ConnectionStrings:MySolutionsCnSt %>' SelectCommand="SELECT [ItemGroup], [ItemGroupId] FROM [DataCoItemGroup] WHERE ([ItemSubClassId] = @ItemSubClassId)">
							<SelectParameters>
								<asp:ControlParameter ControlID="uiItemSubClass" PropertyName="SelectedValue" DefaultValue="SelectedValue" Name="ItemSubClassId" Type="Int32"></asp:ControlParameter>
							</SelectParameters>
						</asp:SqlDataSource>

					</div>

However:

When I change the first DropDownList in the Cascade, the new data gets added to the list in each additional DropDown instead of erased, then rewritten, and NO I dont want a reset button I want to be able to change any DropDown in the 4 to reset the following and rebind.

My question is: What is the proper method for resetting each following DropDownList my current code is:

// Step 1 (Reset Steps 2,3,4)
	protected void uiItemType_SelectedIndexChanged(object sender, EventArgs e)
	{
		// Clear All DropDownLists Below First
		uiItemClass.ClearSelection();
		uiItemClass.Items.Clear();
		uiItemSubClass.ClearSelection();
		uiItemSubClass.Items.Clear();
		uiItemGroup.ClearSelection();
		uiItemGroup.Items.Clear();
		// DataBind Second
		dsItemClass.SelectCommand = "SELECT [ItemClassId], [ItemClass] FROM [DataCoItemClass] WHERE ([ItemTypeId] = '" + uiItemType.SelectedValue + "')";
		uiItemClass.Items.Add(new ListItem("----- SELECT CLASS -----", "-1"));
		uiItemClass.DataBind();
	}

	//Step 2 (Reset Steps 3 and 4)
	protected void uiItemClass_SelectedIndexChanged(object sender, EventArgs e)
	{
		// Clear All DropDownLists Below Second
		uiItemSubClass.ClearSelection();
		uiItemSubClass.Items.Clear();
		uiItemGroup.ClearSelection();
		uiItemGroup.Items.Clear();
		// DataBind Third
		dsItemSubClass.SelectCommand = "SELECT [ItemSubClassId], [ItemSubClass] FROM [DataCoItemClassSub] WHERE ([ItemClassId] = '" + uiItemClass.SelectedValue + "')";
		uiItemSubClass.Items.Add(new ListItem("----- SELECT SUB-CLASS -----", "-1"));
		uiItemSubClass.DataBind();
	}

	// Step 3 (Reset Step 4)
	protected void uiItemSubClass_SelectedIndexChanged(object sender, EventArgs e)
	{
		// Clear All DropDownLists Below Third
		uiItemGroup.ClearSelection();
		uiItemGroup.Items.Clear();
		 // DataBind Fourth
		dsItemGroup.SelectCommand = "SELECT [ItemGroup], [ItemGroupId] FROM [DataCoItemGroup] WHERE ([ItemSubClassId] = '" + uiItemSubClass.SelectedValue + "')";
		uiItemSubClass.Items.Add(new ListItem("----- SELECT GROUP -----", "-1"));
		uiItemGroup.DataBind();
	}

I am seeking Verification if this is the proper way to reset a DropDownList and Repopulate, or are there more steps?

Answer 1

User-707554951 posted

Hi RobertH3，

Form your description and code,  what you do to reset each following DropDownList is ok.

However, what I want to say is that if you use DropDownList.Items.Clear() mehod , you will clear all items form the DropDownList, the DropDownList will not display any items. It’s null. I think that such an interface is not friendly enough.

So, I suggest you could insert an item to you DropDownList after you clear all items from it.

DropDownList.Items.Clear();
DropDownList.Items.Add(new ListItem("--Select Something--", ""));

Besides, if you want to avoid to reset, I suggest you also could use Ajax Cascading Dropdowns, The following links for your reference:

http://www.aspsnippets.com/Articles/AJAX-Cascading-DropDown-Example-in-ASPNet.aspx

Best regards

Cathy