select2 search match с набранной буквой в любой позиции регулярное выражение - PullRequest
3 голосов
/ 09 марта 2020

Есть ли способ поиска любых совпавших букв в select2 ?

Например, если у меня есть следующие опции:

<option value="MANGO">MANGO</option>
<option value="ORANGE">ORANGE</option>
<option value="APPLE">APPLE</option>

и если я введите "mn go", есть ли способ показать опцию "MAN GO" в результатах поиска?

1 Ответ

2 голосов
/ 10 марта 2020

Регулярное выражение ясно, оно добавляет .* между каждым символом и до и после всех символов. Вы можете изменить этот шаблон по своему усмотрению.

Я старался быть менее многословным, это было сложно и весело делать.

$('#select2').select2({
  matcher: function(term, text) {
    // If search is empty we return everything
    if ($.trim(term.term) === '') return text;

    // Compose the regex
    var regex_text = '.*';
    regex_text += (term.term).split('').join('.*');
    regex_text += '.*'

    // Case insensitive
    var regex = new RegExp(regex_text, "i");

    // If no match is found we return nothing
    if (!regex.test(text.text)) {
      return null;
    }

    // Else we return everything that is matching
    return text;
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.js" integrity="sha256-WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU=" crossorigin="anonymous"></script>
<link href="https://cdn.jsdelivr.net/npm/select2@4.0.13/dist/css/select2.min.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/npm/select2@4.0.13/dist/js/select2.min.js"></script>

<select id="select2" style="width:100%;">
  <option value="MANGO">MANGO</option>
  <option value="ORANGE">ORANGE</option>
  <option value="APPLE">APPLE</option>
</select>
...