Как реализовать, чтобы после выбора 3 option в select2, selcet2 становился disabled?

Question

[Иван Шевцов]

Добрый день, есть вот такой код:

<select class="select2 select2-multiple form-control mt-15">
    <option value="1">Option1</option>
    <option value="2">Option2</option>
    <option value="3">Option3</option>
    <option value="4">Option4</option>
    <option value="5">Option5</option>
</select>

Подскажите, как реализовать, чтобы после выбора трех пунктов, к

<select class="select2 select2-multiple form-control mt-15">

добавлялось disabled. Буду признателен за помощь

Comments

[Sergey]

А если пользователь промахнулся мимо нужного пункта, выбор заблокировался, а поменять он уже ничего не может... Лучше оставьте выбор как есть, а Javascript'ом проверяйте количество выбранных значений, при > 3 выводите красную строку рядом, а кнопку действия деактивируйте.

Answer 1

[sergski]

<select class="select2" name="option[]" multiple="multiple">

$('.select2').select2().on('change.select2', function(e) {
    let count = $(this).select2('data').length; 
    if(count == 3) {
        $(this).prop( "disabled", true );
    }
});

Comments

[sergski]

sashabeep, Код работает. Плагин Select2 широко известен и автор явно его упоминает.