Как программно отключить выбор в выпадающем списке «Избранные»

Question

Я использую плагин Chosen для JQuery (https://harvesthq.github.io/chosen/) и хорошо работает. Но мне нужно программно отключить некоторые варианты в раскрывающемся списке, основанные на выборе, и не может найти каких-либо работоспособных примеров. Например, если я выбираю «Item 1», «Item 2» должен быть отключен.

Визуализированное HTML для моего списка является:

<div class="col-md-4"> 
      <label>Groups:</label> 
      <select class="chosen-select" data-placeholder="Type to filter..." multiple="" style="display: none;"> 
      <optgroup class="depth-0" label="Group 1" data-index="-1"> 
      <option class="depth-1" value="Group 1" data-id="0" data-pid="-1">All items</option> 
      <option class="depth-1" data-id="1" value="1" data-pid="-1">Item 1</option> 
      <option class="depth-1" data-id="2" value="2" data-pid="-1">Item 2</option> 
      <option class="depth-1" data-id="3" value="3" data-pid="-1">Item 3</option> 
      <option class="depth-1" data-id="4" value="4" data-pid="-1">Item 4</option> 
      </optgroup> 
      <optgroup class="depth-0" label="Group 2" data-index="-2"> 
      <option class="depth-1" value="Group 2" data-id="0" data-pid="-2">All Items</option> 
      <option class="depth-1" data-id="5" value="5" data-pid="-2">Item 5</option> 
      <option class="depth-1" data-id="6" value="6" data-pid="-2">Item 6</option> 
      <option class="depth-1" data-id="7" value="7" data-pid="-2">Item 7</option> 
      <option class="depth-1" data-id="8" value="8" data-pid="-2">Item 8</option> 
      </optgroup> 
      </select> 

      <div class="chosen-container chosen-container-multi" style="width: 2px;" title=""> 
      <ul class="chosen-choices"> 
      <li class="search-choice"><span>Item 1</span><a class="search-choice-close" data-option-array-index="2"></a></li> 
      <li class="search-field"><input type="text" value="Type to filter..." class="" autocomplete="off" style="width: 25px;"></li></ul> 

      <div class="chosen-drop"> 
      <ul class="chosen-results"> 
      <li class="group-result depth-0">Group 1</li> 
      <li class="active-result group-option depth-1" data-option-array-index="1">All items</li> 
      <li class="result-selected group-option depth-1" data-option-array-index="2">Item 1</li> 
      <li class="active-result group-option depth-1" data-option-array-index="3">Item 2</li> 
      <li class="active-result group-option depth-1" data-option-array-index="4">Item 3</li> 
      <li class="active-result group-option depth-1" data-option-array-index="5">Item 4</li> 
      <li class="group-result depth-0">Group 2</li> 
      <li class="active-result group-option depth-1" data-option-array-index="6">All items</li> 
      <li class="active-result group-option depth-1" data-option-array-index="7">Item 5</li> 
      <li class="active-result group-option depth-1" data-option-array-index="8">Item 6</li> 
      <li class="active-result group-option depth-1" data-option-array-index="9">Item 7</li> 
      <li class="active-result group-option depth-1" data-option-array-index="10">Item 8</li> 
      </ul> 

      </div> 
</div> 

Answer 1

Разве вы не знаете ... как только я отправляю вопрос, который я нашел правильную комбинацию команд:

var itemToDisable = $("option:contains('Item 2')"); 
itemToDisable.attr("disabled",true); 
chosen_select.trigger("chosen:updated"); 

Секретный соус устанавливает атрибут «disabled» для опции, а затем запускает выбранное обновление.