jquery - Hide Asp:DropDownList based on select dropdownlist values? -

i'm trying hide 2 dropdownlists based on value "select" dropdownlist. ddlists want hide asp:dropdownlists. select class looks this:

<select class="form-control" id="number_rooms">              <option>1</option>              <option>2</option> </select> 

when value 1, dropdownlists should hidden. when value 2, users should see them.

code:

<asp:dropdownlist id="droplist1" cssclass="form-control" runat="server">               <asp:listitem>2</asp:listitem>               <asp:listitem>1</asp:listitem>    </asp:dropdownlist>  <asp:dropdownlist id="droplist2" cssclass="form-control" runat="server">               <asp:listitem>2</asp:listitem>               <asp:listitem>1</asp:listitem>    </asp:dropdownlist> 

have tried jquery former posts, none seem work..

jquery code:

        $(function () {             $("#number_rooms").change(function() {                 $("#droplist1").hide();                 $("#droplist2").hide();             });         }); 

have tried this:

        $(function () {             if ($("#number_rooms").val() == 1)                  $("#droplist1").hide();                 $("#droplist2").hide();         }); 

the value 1 @ default, @ page loadup should hidden, , if user select value = 2 , should shown.

hope can see doing wrong.

when asp:dropdownlist gets rendered id changes include id of container or containers

so dropdownlist rendering id this

<select class="form-control" id="mycontainer_droplist1">     <option>...</option> </select> 

you can correct client id using

$("#<%= droplist1.clientid %>").hide(); $("#<%= droplist2.clientid %>").hide(); 

or can change declaration of asp:dropdownlist make id static , avoid having container ids setting clientidmode default id generation

the clientid value generated concatenating id values of each parent naming container id value of control. in data-binding scenarios multiple instances of control rendered, incrementing value inserted in front of control's id value. each segment separated underscore character (_).

<asp:dropdownlist clientidmode="static" id="droplist2" cssclass="form-control" runat="server">     <asp:listitem>2</asp:listitem>     <asp:listitem>1</asp:listitem>    </asp:dropdownlist> 

static : clientid value set value of id property. if control naming container, control used top of hierarchy of naming containers controls contains.