2016-07-21 14 views
2

ユーザーが複数選択リストから3つ以上の項目を選択できないようにする小さな機能を作成したいと思います。 ウェブ上で便利なものがいくつか見つかりました。ユーザーが3つ以上のアイテムを選択したときに警告を発することができました。しかし、最後に選択したアイテムを削除する方法が見つかりません。Select2の最後の選択を削除しますか?

これまでのところ、ここに私のjQueryの:ユーザーが3つの以上の項目を選択した場合、このコードで

$('.metiersMission').change(function(event) { 
if ($(this).val().length > 3) { 
    alert('Vous ne pouvez choisir que 3 métiers'); 
    $(this).select2('val', ''); 
} 
}}); 

、コードは単に私が欲しいものは明らかにされていない、ユーザーがこれまでに選択したすべてを削除します。私はどこでもこれについて何かを見つけることができません、誰もがアイデアを持っていますか?

はあなたがchangeイベントに耳を傾け、選択したオプションをカウントすることができ、事前

答えて

2

でいただきありがとうございます。あなたはそれぞれの子に変化に耳を傾け、そして選択された以上の3人の子供がある場合、子を選択することを拒否することができます

$(document).on('change', 'select', function() { 
 
    var that = $(this); 
 
    var val = that.val(); 
 
    if (val.length > 2) { 
 
    // Find every unselected option and disable them 
 
    that.find('option').not(':selected').attr('disabled','disabled'); 
 
    } else { 
 
    // Enable all options 
 
    that.find('option').removeAttr('disabled'); 
 
    } 
 
});
select { width:250px; height:150px }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> 
 
<select multiple> 
 
    <option value="volvo">Volvo</option> 
 
    <option value="saab">Saab</option> 
 
    <option value="opel">Opel</option> 
 
    <option value="audi">Audi</option> 
 
    <option value="citroen">Citroen</option> 
 
    <option value="peugeot">Peugeot</option> 
 
</select>

0

は、選択したオプションが3であれば、他のすべてのオプションを無効にします
$('.metiersMission').children('option').each(
    $(this).change(function(event) { 
     if ($(this).parent('select').val().length > 3) { 
      alert('Vous ne pouvez choisir que 3 métiers'); 
      $(this).removeAttr('selected'); 
     } 
    }}); 
)}; 
関連する問題