Отключить опцию, при выборе другой опции в множественном выборе

Question

У меня есть мультиселект в HTML, как показано ниже. Я пытаюсь отключить все параметры, когда выбраны все типы, и отключить все типы, когда выбраны любые другие (один или несколько). Когда страница загружена, по умолчанию выбран параметр " Все типы ", пользователь может изменить его позже. HTML выглядит так:

<select multiple="multiple" class="multiselect">
    <option value="default" selected="selected">All Types</option>
    <option value="Mobile">Mobile</option>
    <option value="Laptop">Laptop</option>
    <option value="Desktop">Desktop</option>
</select>    

И Jquery как:

$(".multiselect").multiselect({
    buttonWidth: '150px',
    onChange:function(){
     /*some code needed here*/
    }
}); 

Когда выбрано "Все типы", результатом должно быть ["Мобильный", "Портативный компьютер", "Рабочий стол"] или ["по умолчанию"], и если выбран какой-либо другой параметр (один или несколько), то это значение в массиве. Я столкнулся с некоторой проблемой с отключением опций в пользовательском интерфейсе. Ждем решения для решения этой проблемы. Заранее спасибо:)

Answer 1

Для ответа от madalinivacsu.

если вы используете selected-pluggin, не забудьте добавить триггер:

$('[name=option_element]').on('change', function () {
        $(this).find('option').prop("disabled",false).trigger('chosen:updated');//enable all
        if ($(this).find('option:selected').is('option[value="option_default"]')) {
            $(this).find('option:not(":selected")').prop("disabled", true).trigger('chosen:updated');
        }
    });

Answer 2

Условие "если значение" по умолчанию "выбрано":

if($(this).val() == "default")

после этого вам просто нужно отключить или включить опции, которые вы можете сделать с помощью обычного jQuery.

$("option[value='Mobile']").prop("disabled", true);

Answer 3

Попробуйте использовать следующее событие изменения

$('select').on('change',function(){
$(this).find('option').prop("disabled", false);//enable all
if($(this).find('option:selected').is('option[value="default"]')) {}
  $(this).find('option:not(":selected")').prop("disabled", true);
})