Question

I have an HTML select list (let’s call it List A) that is dynamically populated with a list of values. I need to change another select list (List B) depending on the value of List A. That part, I can do. Ordinarily, the user selects one element of List A, and gets a List B contingent on List A.

However, the first element of List A is “All Values.” Therefore, in this instance, I want a List B that consists of the aggregate of all of the values possible for List B. Because the available values of List A are dynamically generated, I can’t simply pull all List B values. I need to pull all List B values contingent on all List A values shown.

To do this, I want to iterate through all of the values in List A, and append to List B for each item in List A. This is where I’m stuck. How can I populate an array to consist of all of the values in a select list? Again, because List A is populated dynamically, the only way to get a list of these values is to pull them from the select list element.

I tried this:

iterate_models = $.map($('#listA'), function(e) { return $(e).val(); });

This did not give me an array of the values of each element in #listA. I can’t figure out why not.

Answer 1

You need to map val() over all the <option> elements in your dropdown list:

iterate_models = $.map($("#listA option"), function(e) {
    return $(e).val();
});