Select2 отключить/включить конкретную опцию

У меня есть список, который имеет тип select2.

<select id="list" class="form-control select2 select2-hidden-accessible" tabindex="-1" aria-hidden="true">
<optgroup label="Types">
<option value="None">None</option>
<option value="1">One</option>
<option value="2">Two</option>
</optgroup>
</select>

Я хочу отключить опцию, которая имеет value = 1 поэтому мне это понравилось

$("#list>optgroup>option[value='1']").prop('disabled',true);
   Result:// <option value="1" disabled>One</option>

Он работает нормально, но если я хочу снова включить отключенную опцию, я попробовал под кодами, но все же опция select2 отключена.

$("#list>optgroup>option[value='1']").prop('disabled',false);
$("#list>optgroup>option[value='1']").removeProp('disabled');
  Result://   <option value="1">One</option>

но странно отключено свойство опции удалено. но опция select2 остается отключенной.

Не получается, как это решить. Нужна помощь.

Обновление: если я проверяю DOM select2, он имеет это свойство даже после того, как отключено.

<li class="select2-results__option" id="select2-template-type-list-result-4qd3-merge" role="treeitem" aria-disabled="true">One</li>

если я сделаю aria-disabled = "false" , он включится. не в состоянии получить причину.

Ответ 1

Вероятно, самый простой способ добиться этого, снова вызовет .select2(…) в элементе после изменения отключенного атрибута.

http://jsfiddle.net/xoxd2u15/

Так как select2 заменяет исходное поле выбора на пользовательские элементы HTML (и скрывает оригинал) и, по-видимому, не "постоянно" отслеживает параметры этого исходного элемента выбора для изменений в их отключенном состоянии после вызова, вы должны его вызвать еще раз после изменения состояния, чтобы он считывал текущие значения атрибутов из параметров исходных элементов.

Ответ 2

Отключить. Попробуйте следующее:

$("#list>optgroup>option[value='1']").attr('disabled','disabled');

Удалить Отключить Попробуйте следующее:

$("#list>optgroup>option[value='1']").removeAttr('disabled');

Ответ 3

Есть некоторые странные случаи, когда вам нужно удалить как prop (свойство узла), так и attr (атрибут HTML документа). На самом деле они не одно и то же, хотя jQuery относится к ним таким образом.

Так что вам нужно сделать

$("#list>optgroup>option[value='1']").removeAttr('disabled').removeProp('disabled');

Таким образом, он удаляет свойство узла и атрибут dom.

Тем не менее, вам, вероятно, нужно обновить экземпляр select2, для которого никто здесь не упомянул правильное решение.

$('#list').trigger('change.select2');

.trigger('change') также будет работать, но имеет некоторые побочные эффекты, если в событие изменения подключены другие функции. Кроме того, вы не можете использовать его внутри уже подключенной ('change') функции.

Ответ 4

Ниже строка кода отключит все параметры.

$('#list  option').prop('disabled',true);

В этой строке будет включена только опция, имеющая значение 1.

$('#list option[value="1"]').prop('disabled',false);

$('#list').select2();

Выше приведен более упрощенный ответ.