toggle dropdownlist visibility

Question

i have a dropdownlist in aspx (vb.net) that i have 2 dropdownlists. i want to show the second dropdownlist based on the value of first one. they are data wise interconnected, so if after selecting a certain record in first, if the second one has more than one record, the dropdownlist should be visible, else it should remain hidden. am sure this can be done with javascript, but i just dont know how.

thanks

Answer 1

I assume you are ok with getting the data to fill the second dropdownlist. If not, you can do that with javascript using AJAX. You can also do it with a postback (much easier, but worse for the end user).

Here is how to set the second dropdownlist to be invisible or visible: its style property.

hidden:

display: none;

or visible:

display: block;

Answer 2

Since the data in the second dropdown is dependent on the selection in the first dropdown you will have to do a postback. You can toggle the second dropdown's visible property to false in the SelectedIndexChanged event of the first dropdown.

If you want to use Javascript you can use AJAX for the postback.

Answer 3

This link seems to be exactly what you are looking albeit a little complicated.

http://sushantp.wordpress.com/2009/02/22/aspnet-fill-and-show-dependent-drop-down-list-on-client-side-without-server-control-and-postback/

I personally would use AJAX update panels to achieve the effect.

Answer 4

An alternative would be to use jQuery and JSON to build a cascading dropdownlist. There is a nice post on how to achieve this: http://www.codedigest.com/Articles/jQuery/224_Building_Cascading_DropDownList_in_ASPNet_Using_jQuery_and_JSON.aspx