Disable option in dropdown list based on selection in other list

Question

I have the following code

$(\'select\').on(\'change\', function(){
    $(\'select option\').prop(\"disabled\", false);
    $(\"select\").not(this).find(\"option[         


        

Answer 1

This is pretty much the same as what you already had, except it loops over each select each time one changes, and disables the option selected in the other selects:

var $selects = $('select');

$selects.on('change', function() {

    // enable all options
    $selects.find('option').prop('disabled', false);

    // loop over each select, use its value to 
    // disable the options in the other selects
    $selects.each(function() {
       $selects.not(this)
               .find('option[value="' + this.value + '"]')
               .prop('disabled', true); 
    });

});

Here's a fiddle