Select2 – это популярная библиотека JavaScript, которая расширяет функциональность HTML-элементов выбора, предоставляя более удобный интерфейс. По умолчанию Select2 позволяет пользователям выбирать только из предопределенных параметров в раскрывающемся списке. Однако существуют сценарии, в которых вы можете вообще запретить пользователям вводить собственные значения. В этой статье мы рассмотрим несколько методов достижения этой цели, используя простой для понимания язык и практические примеры кода.

$('select').select2({
  tags: false
});

Метод 2: использование параметра «maximumSelectionLength».
Другой подход — ограничить количество вариантов выбора до нуля, что фактически не позволяет пользователям добавлять собственные значения. Это можно сделать с помощью опции «maximumSelectionLength»:

$('select').select2({
  maximumSelectionLength: 0
});

Метод 3: удаление поля ввода
Select2 включает поле ввода в раскрывающемся списке, позволяющее пользователям вводить собственные значения. Вы можете скрыть или удалить это поле ввода, чтобы предотвратить любой пользовательский ввод. Вот пример:

$('select').select2({
  minimumResultsForSearch: Infinity
});

Метод 4: использование функции «сопоставление»
Select2 предоставляет функцию «сопоставление», которая позволяет указать пользовательскую логику сопоставления. Возвращая nullиз этой функции, вы можете запретить принятие пользовательских значений. Вот пример:

$('select').select2({
  matcher: function(params, data) {
    if ($.trim(params.term) === '') {
      return data;
    }
    return null;
  }
});

Метод 5: отключение ввода с клавиатуры
Вы можете отключить ввод с клавиатуры в Select2, что эффективно запретит пользователям вводить любые пользовательские значения. Вот как этого можно добиться:

$('select').select2({
  disabled: true
});