locked
C# Multiple Cascading DropDownList RRS feed

  • 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?

    Wednesday, November 9, 2016 3:56 AM

All replies

  • 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

    Thursday, November 10, 2016 3:04 AM