web-dev-qa-db-ja.com

select2 search-検索用語で始まる単語のみに一致します

選択したプラグインからselect2プラグインに移行しました。これは私にとってはうまく機能するためですが、そのドキュメントは選択したプラグインと比較すると非常に貧弱です。 select2検索機能を使用して、検索用語で始まる単語をフィルタリングするためにどのオプションを使用する必要があるかを誰かに教えてもらえますか（途中に含まないでください）。

Select2フィールドにそれらのオプションがあるとしましょう：バナナ、アップル、パイナップル。

ユーザーが "app"（またはApple）を入力すると、Appleのみが返されます（これはAppleで始まる唯一のWordであるためです）。現在は、Appleとパイナップルの両方を返します。

たくさん検索した結果、カスタムマッチャーを使用する必要があることがわかりましたが、これですべてです。

jquery-select2jquery-select2-4
13
Mindaugas Li

Select2は、カスタムmatcher関数を使用して検索語と検索結果を照合する方法について ドキュメントの例 を提供します。与えられた例は、まさにこのユースケースです。

function matchStart (term, text) {
  if (text.toUpperCase().indexOf(term.toUpperCase()) == 0) {
    return true;
  }
 
  return false;
}
 
$.fn.select2.AMD.require(['select2/compat/matcher'], function (oldMatcher) {
  $("select").select2({
    matcher: oldMatcher(matchStart)
  })
});
<link href="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.css" rel="stylesheet"/>

<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>

<select style="width: 200px">
  <option value="AL">Alabama</option>
  <option value="AK">Alaska</option>
  <option value="AZ">Arizona</option>
</select>
19
Kevin Brown

選択2 4.0.0

function matchStart(params, data) {
    params.term = params.term || '';
    if (data.text.toUpperCase().indexOf(params.term.toUpperCase()) == 0) {
        return data;
    }
    return false;
}

$("select").select2({
    matcher: function(params, data) {
        return matchStart(params, data);
    },
});
23
Arturo Montoya