0

I have the following in the page aspx

    <asp:DropDownList ID="ddl1" runat="server">
        <asp:ListItem Text="[ == Please Select == ]" Value="" />
        <asp:ListItem Text="TOYOTA" Value="TOYOTA" />
        <asp:ListItem Text="MERCEDES-BENZ" Value="MERCEDES-BENZ" />
        <asp:ListItem Text="BMW" Value="BMW" />
        <asp:ListItem Text="HONDA" Value="HONDA" />
        <asp:ListItem Text="FORD" Value="FORD" />
    </asp:DropDownList>

    <asp:DropDownList ID="ddl2" runat="server">
        <asp:ListItem Text="[ == Please Select == ]" Value="" />
        <asp:ListItem Text="Available" Value="Available" />
        <asp:ListItem Text="Not available" Value="Not available" />
    </asp:DropDownList>

I would like to remove certain values from the DropDownList ddl2 cloned if certain conditions are true.

E.g

if(ddl1.value=="HONDA"){
  // remove Available value from the DropDownList ddl2 cloned
}

Output

//DROP DOWN LIST CLONED FROM DDL2
<asp:DropDownList ID="ddl2_x" runat="server">
    <asp:ListItem Text="[ == Please Select == ]" Value="" />
    <asp:ListItem Text="Not available" Value="Not available" />
</asp:DropDownList>

How can I do this using jquery

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
    $("[id*=btnClone]").bind("click", function () {
        var index = $("#container select").length + 1;

        //Clone the DropDownList
        var ddl2 = $("select[id$=ddl2]").clone();
        ddl2.attr("id", "ddl2_" + index);
        ddl2.attr("name", "ddl2_" + index);

        var selectedValue2 = $("select[id$=ddl2] option:selected").val();
        ddl2.find("option[value = '" + selectedValue2 + "']").attr("selected", "selected");

        //Append to the DIV.
        $("#container").append(ddl2);
        $("#container").append("<br /><br />");

        return false;
    });
});
</script>

<div id="container">
   <asp:Button ID="btnClone" Text="Clone" runat="server" />
</div>
Hamamelis
  • 1,983
  • 8
  • 27
  • 41
  • Does this answer your question? [jQuery remove options from select](https://stackoverflow.com/questions/1518216/jquery-remove-options-from-select) – Don't Panic Sep 27 '22 at 08:15

0 Answers0