How can I populate another dropdown with the onChange event of the first dropdown?

Question

with jquery, or with simple just javascript, I want to populate a 2nd dropdown from the choice of the first dropdown. The value of the first dropdown is the condition to ge

Answer 1

A functional but less elegant solution follows. This is a way to populate a states/province select list based on whether the United States (US) or Canada (CA) is chosen first. US and US States are visible by default. This method relies on a simple class naming convention to group the state options based on their parent country.

The JS:

$('#s_country').change(function() {
    $('#s_state .state_CA').hide();
    $('#s_state .state_US').hide();
    $('#s_state').val('');
    var value = $.trim($("#s_country").val());
    $('#s_state').show();
    $('#s_state .state_'+ value).show();
});

The HTML:

state_code == $current_state)?'selected="selected"':''; ?>
     >state)?>

state_code == set_value('s_state'))?'selected="selected"':'';                          ?>
    >state)?>
   

Hope this helps.