Looping through and updating the values in a select list

Question

I'm trying to update the options of ALL select lists on a page and implemented a solution found on Get list of all `input` objects using JavaScript, without accessing a `form` object and other pages.

This works to an extent but only the select lists which occur AFTER the one which is triggering the javascript are updated whereas I need them ALL done, regardless of their position relative to the triggering select.

Here's a simplified version of what I have:

function chooseBon(id, value) {

var bonbonsAmount  = 12;
    var bonbonsCurrent = 0;
    var bonbonsCount   = 4;

    var inputs, index;


    // get all the select lists
    inputs = document.getElementsByTagName('select');

// loop through all the lists
    for (index = 0; index < inputs.length; ++index) {

// First disable all options
for (j = 0; j<=bonbonsAmount; ++j) {
    inputs[index].options[j].disabled="disabled";
}

    // Then re-enable the ones we still need
    for (j = 0; j<=(bonbonsAmount - bonbonsCurrent); ++j) {
    inputs[index].options[j].disabled="";
}

// add up the no of chocs selected so we know how many options to re-enabled above
bonbonsCurrent += inputs[index].selectedIndex;

}

I'm an admitted newbie and am adapting a script from one ecommerce platform for another so am hamstrung in certain areas so feel free to make other suggestions.

Answer 1

here is one of possible solutions and the fiddle:

function chooseBon() {
    var bonbonsAmount = 12;
    var bonbonsCurrent = 0;
    var bonbonsRemaining; //max. is bonbonsAmount
    var inputs, i, j;
    inputs = document.getElementsByTagName('select');
    for (i = 0; i < inputs.length; i++) {
        bonbonsCurrent += parseInt(inputs[i].value, 10);
    }
    bonbonsRemaining = bonbonsAmount - bonbonsCurrent;
    for (i = 0; i < inputs.length; i++) {
        for (j = 0; j <= bonbonsAmount; j++) {
            inputs[i].options[j].disabled = (j < bonbonsRemaining + parseInt(inputs[i].value, 10) + 1) ? false : true;
        }
    }
}