Search code examples
asp.netwebformshtml-selectcascadingdropdown

Different values in dropdownlist depends on what i select in another dropdownlist


What I want to make and Create: I want to make 2 dropdownlist in asp.net. Lets say the first contains countries, and the second contains the cities in the countries.

Lets say I select England in the first Dropdownlist and then only the Cities that belongs to England will be visible or selectable in the second dropdownlist.

<asp:DropDownList ID="Countries" runat="server">  // First dropdownlist
    <asp:ListItem>England</asp:ListItem>
    <asp:ListItem>Denmark</asp:ListItem>
</asp:DropDownList>

<asp:DropDownList ID="Citys" runat="server">    // Second dropdownlist
</asp:DropDownList>

I hope I explained it good enough and I hope that someone can provide me with either some code that can do it or a hint about it.


Solution

  • If you use SqlDataSource, you can cascade the selected value to CitySqlDataSource.

    Here the demo -

    Database

       Countries                                Cities
    Id       Name                    Id      CountryId      Name
    1        England                 1            1         London
    2        Denmark                 2            2         Copenhagen    
    

    ASPX

    <asp:DropDownList ID="CountryDropDownList" runat="server"
        DataSourceID="CountrySqlDataSource" 
       DataTextField="Name" DataValueField="Id" AutoPostBack="True">
    </asp:DropDownList>
    <asp:SqlDataSource ID="CountrySqlDataSource" runat="server"
        ConnectionString="<%$ ConnectionStrings:ConnectionString %>"
        SelectCommand="SELECT Id,Name FROM [Countries]"></asp:SqlDataSource>
    
    <asp:DropDownList ID="CityDropDownList" runat="server"
        DataSourceID="CitySqlDataSource" 
        DataTextField="Name" DataValueField="Id">
    </asp:DropDownList>
    <asp:SqlDataSource ID="CitySqlDataSource" runat="server"
        ConnectionString="<%$ ConnectionStrings:ConnectionString %>"
        SelectCommand="SELECT Id,Name FROM Cities WHERE CountryId=@CountryId">
        <SelectParameters>
            <asp:ControlParameter ControlID="CountryDropDownList" 
                PropertyName="SelectedValue"
                Name="CountryId " Type="String" 
                DefaultValue="England" />
        </SelectParameters>
    </asp:SqlDataSource>
    

    Here is the similar answer.