select 2 + click on value

Question

clickイベントで選択値が必要な問題に直面しています。私はchangeイベントで試しましたが、現在の値の代わりにカンマ区切りのすべての値を取得します。

私がしたいことは、Allオプションを持つ複数のオプションがあるとします。したがって、ユーザーがAllオプションを選択すると、選択したすべてのオプションがクリアされ、Allオプションのみが表示されます。

私はそれが最初のクリックでnullを表示するコード

$(".chzn-select").on('select2:selecting', function() { 
    var st = ($(this).select2('val')); 
} 

の下に試してみました。カンマ区切り形式で

そして

$(".chzn-select").on('change', function() { 
    var st = ($(this).select2('val')); 
} 

ショーのすべての値。私が見つけた例はありませんonclickselect2 JSのイベントです。ここでevents

HTML

<select name="country[]" multiple="" data-placeholder="Select country" class="form-control chzn-select" required="required" id="country"> 
    <option disabled="disabled" value="1">Abu Dhabi</option> 
    <option value="2">Dubai</option> 
    <option disabled="disabled" value="3">Singapore</option> 
    <option disabled="disabled" value="4">Thailand</option> 
    <option value="8">Afghanistan</option> 
    <option value="All">All</option> 
</select> 

のリストは、ここで私はあなたを取得していないjsfiddle

Answer 1

https://jsfiddle.net/bayahiassem/gtew005w/11/

$(".chzn-select").select2({selectOnClose: true}).on("select2:selecting", function(evt) { 
     if(evt.params.args.data.id == 'All') { 
     $(".chzn-select").val(null).trigger("change"); 
     } else { 
     $('.chzn-select > option[value=All]').prop("selected", false); 
     } 
    }); 

Answer 2

です。 私は正しい場合。

$(this).select2('val').find(':selected'); 

Answer 3

ここにあります。私はこれが働くことを願っています複数の選択のためにCtrl]キーを押し

$(function() { 
 
    $(".chzn-select").on('change', function (evt) { 
 
    $('#selected').text('Selected: ' + ($(this).val())) 
 
    }) 
 
})

select { 
 
    width: 50%; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select name="country[]" multiple="" data-placeholder="Select country" class="form-control chzn-select" required="required" id="country"> 
 
    <option disabled="disabled" value="1">Abu Dhabi</option> 
 
    <option value="2">Dubai</option> 
 
    <option disabled="disabled" value="3">Singapore</option> 
 
    <option disabled="disabled" value="4">Thailand</option> 
 
    <option value="8">Afghanistan</option> 
 
    <option value="All">All</option> 
 
</select> 
 

 
<div id="selected"></div>

Answer 4

、

$(".chzn-select").select2({selectOnClose: true}); 
$(".chzn-select").on("select2:select", function (evt) { 
    if($.inArray('All',$(this).val()) != -1){ 
    $(this).val('All').trigger("change"); 
    } 
}); 

- あなたは現在選択した項目（複数可）それを与えます

あなたのjsコードをこれで置き換えればうまくいきます。

ここには作業コード用のjsfiddleリンクがあります。