jquery - 条件付きでいくつかのオプションの選択を無視するには?

Question

複数選択の従業員リストのドロップダウンにhttp://ivaynberg.github.io/select2/select2.jsのプラグインを使用しています。

<select id="empList" name="empList" multiple="multiple">
<option value="ALL">ALL</option>
<option value="1">emp 1</option>
<option value="2">emp 2</option>
<option value="3">emp 3</option>

私の要件は、ユーザーが「ALL」を選択した場合、個々の従業員を選択できないことです。ユーザーが任意の従業員を選択した場合、「ALL」は選択できません。

ありがとう、

Answer 1

このコードはテストしていませんが、次のようになります。

$('#empList').change(function () {
    var self = $(this);
    if (self.val() == undefined) { // Selected all option
       $.each(self.find('option'), function (res) {
           if (res.attr('value') != undefined) {
              res.prop('disabled', true);
           }
       })
    }
    else {
       $.each(self.find('option'), function (res) {
           if (res.attr('value') != undefined) {
              res.prop('disabled', false);
           }
       })
    }
})

それが役立つことを願っています。

Answer 2

次のようなものを探していると思います: http://jsfiddle.net/jaTPc/

変更された html (追加されたクラス) は次のとおりです。

<select id="empList" name="empList" multiple="multiple">
<option value="ALL" class="all">ALL</option>
<option value="1" class="notall">emp 1</option>
<option value="2" class="notall">emp 2</option>
<option value="3" class="notall">emp 3</option>
</select>

そして、jQuery

$("#empList").change(function() {
var optionAll = $(".all");
var optionOther = $(".notall");

this.value == "ALL" ?  optionOther.prop("disabled", true) : optionAll.prop("disabled", true);
});

Answer 3

私はあなたのための解決策を手に入れました...これをスクリプトに保管してください..、

$('#empList').click(function(){
   var Value = $(this).val();
   $("#empList option").each(function(){
      var Opt = $(this).val();
      if(Value == 'ALL'){
          if(Opt != Value){
              $("option[value="+Opt+"]").prop('disabled', true);
          } else {
              $("option[value="+Opt+"]").prop('disabled', false);
          }
      } else {
          if(Value == null) {
              $("option[value="+Opt+"]").prop('disabled', false);
          } else {
              $("option[value='ALL']").prop('disabled', true);
          }
      }
    });
});