Bootstrap Multiselect - How can i disable other multiselect(id=2 value=2),when i select (id=1 value=2)

Question

I want to disable other multiselect('#multiselect2' option value=2) having same options, When I select Multiselect('#multiselect1' option value=2) option multiselect1 can select single and multiselect2 too.

I've trying to implement :onChange() like in the following code. But it's not working.

$(document).ready(function () {
    $('#multiselect1').multiselects({
        maxHeight: 200,
        onChange:function(element, checked) {
            var brands = $('#multiselect1 option:selected');
            var select = brands.val();
            var selected = [];
            $(brands).each(function(index, brand){
                selected.push([$(this).val()]);
            });
            var brand = $('multiselect1 option:selected');
            var select = brand.val();
            $('multiselect2 option[value="' + select + '"]').
                prop('disabled', true).prop('selected', false);
        }
    });
});

Answer 1

Try this code,

$(document).ready(function () {
    $('#multiselect1').multiselects({
        maxHeight: 200,
        onChange:function(element, checked) {
            var brands = $('#multiselect1 option:selected');
            var select = brands.val();
            var selected = [];
            $(brands).each(function(index, brand){
                selected.push([$(this).val()]);
            });
            var brand = $('multiselect1 option:selected');
            var select = brand.val();
            $('multiselect2 option[value="' + select + '"]').prop('disabled', true).prop('selected', false);
            $('#multiselect2').multiSelect('refresh'); 
        }
    });
});

It will work.