Question

I’m trying to do a round-about way of having dependent drop-down boxes. I’m hoping to accomplish this with a JQuery selector.

Basically, I’m going to have 1 drop down which lists countries, then if, and only if, United States is selected, I’ll have another dropdown appear showing states.

Is there a selector/filter I can use in JQuery to basically say if this dropdown = this value, make the other one appear?

Like a

 $("select[option=United States]").change(function() {
      $("#newdropdown").fadeIn();
 });

or something like that…?

Answer 1

You should have a change() handler, and then test for the value inside:

$("select").change(function() {
    if ($(this).val() == "something") {
        $("#newdropdown").fadeIn();
    } else {
        $("#newdropdown").fadeOut();
    }
});

Example: http://jsfiddle.net/jtbowden/BwuPc/