Select2 Multiselect Dropdown пользовательский поиск

Question

Я пытаюсь изменить функциональность поиска в раскрывающемся списке множественного выбора select2 таким образом, чтобы вместо поиска элементов, содержащих искомый символ, я искал элементы, начинающиеся с искомого символа. Я сослался на документацию select2, но они заявили, что -

Для полей с несколькими выборами нет отдельного элемента управления поиском

Значит ли это, что у нас нет обходного пути для изменения этой функциональности?

Пример для моего требования: Предполагая, что раскрывающийся список содержит 4 элемента, а именно,

Австралия, Аргентина, Индия, США

и если пользователь вводит «A» для поиска, он возвращает все четыре значения, поскольку все значения содержат «A». Но мое требование - возвращать только те значения, которые начинаются с 'A', например

Австралия и Аргентина

Как этого достичь?

Answer 1

Вы можете использовать свойство matcher, потребовав от него изменить действие поиска, используя

select2.amd.require(['select2/compat/matcher'], ...)

Обратите внимание, что это свойство существует только в полной версии select2 (select2.full.js)

function search(term, text) {
  if (text.toUpperCase().indexOf(term.toUpperCase()) == 0) {
    return true;
  }
 
  return false;
}
 
$.fn.select2.amd.require(['select2/compat/matcher'], function (f) {
  $("select").select2({
    matcher: f(search)
  })
});

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.full.js"></script>
<link href="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.css" rel="stylesheet" />

<select multiple style="width:100%;">
  <option>France</option>
  <option>Family</option>
  <option>Freezone</option>
</select>

Скрипка: https://jsfiddle.net/nx1eaLgz/