Question

i want to create array of same id or name using getElementById..

i have a “add button”, when the user press this button, its generate a dropdown list(dynamic) which the value is get from mysql..

and its looks like this when the user press 3 times..

i want to create an array of this id, and store it to mysql..

this is my JS code :

  var menu_paket_array = document.getElementById('menu_paket').value;   

  alert(menu_paket_array);  

the problem is, when i try to create this array(menu_paket_array), the value in this array is just the first id (Test 1) only..

how can i fix this?

thanks…

Answer 1

An ID must be unique on a page. You can only use it on one element.

Instead, use a CSS class or element type to iterate (here’s a fiddle demonstrating this code):

function alertValues() {
    var select, selects = document.getElementsByTagName('select');
    var out = "";
    for (var i = 0; i < selects.length; i++) {
        select = selects[i];
        if (select.className && select.className.match(/CLASSNAME_TO_INCLUDE/)) {
            out += select.options[select.selectedIndex].value;
        }
    }
    alert(out);
}

A better solution, of course, would be to utilize a dom library like jQuery or mootools, with which you could do something like this:

jQuery(function($) {
    vals = [];
    $('select.CLASSNAME').each(function() { vals.push($(this).val()); });
    alert(vals.join(','));
});