Question

When a user choose the “a” option in the first list below (id=1), I’d like to display the second form (id=2). How detect the choice of a user in a list (just a selection, not a submission) ?

 <form method="post" id="1" >
      <select name="menu_destination">
           <option value="a" >A</option>
           <option value="b">B</option>
      </select>
 </form>

 <form method="post" id="2" >
      <select name="menu_destination">
           <option value="a" >A</option>
           <option value="b">B</option>
      </select>
 </form>

Edit: I’ve already encounter another problem : each time I select an option, it displays a list without hiding the others. annoying, no ?

$("select#category").change(function() {
    var category = $(this).val();
    $("select#"+category).toggle();
});

Answer 1

Simple. And IDs should not start with numbers, at least not until HTML5 is all over the place.

$("#one select").change(function() {
    $("#two").toggle($(this).val() == "a");
});

Demo.

Note: In the demo, the second form’s visibility is initially hidden via style="display:none" but it is visible when the page loads because we initially trigger the change event to set the correct state of the form according to the what is initially selected (i.e. what is initially rendered) in the first form’s drop-down.