C# Multiple Cascading DropDownList RSS

• • Reply
  RobertH3

  Member

  8 Points

  100 Posts

  C# Multiple Cascading DropDownList

  Nov 09, 2016 03:56 AM|RobertH3|LINK

  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?

• • Reply
  Cathy Zou

  Star

  8670 Points

  2882 Posts

  Re: C# Multiple Cascading DropDownList

  Nov 10, 2016 03:04 AM|Cathy Zou|LINK

  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

  MSDN Community Support
  Please remember to click "Mark as Answer" the responses that resolved your issue.
  If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.