0

カスタム データを含むアイテムを表示する jquery オートコンプリート ウィジェットがあります。

それらはすべてvalue、および を持っていdescriptionます。
現在、valueアイテムがクリックされると がテキストボックスに挿入され、valueアイテムの が検索されます

私がやりたいのは、フィルタでvalueと の両方を使用して項目をフィルタリングして表示することですが、挿入されdescriptionているものだけを保持します。value

どうすればこれを達成できますか?

4

1 に答える 1

1

valueオートコンプリータに ( ではなく)およびlabel(ではなく) プロパティを持つオブジェクトの配列を指定すると、( ではなくdescription) に対してのみフィルタリングが行われます。labelvalue

sourceオプションに関数を指定する場合、フィルタリングは自分で行う必要があります。引数 (プロパティrequestを持つオブジェクト) と引数 (結果でコールバックする関数) を受け取ります。次に、任意の種類の検索を使用して、関連する結果を自分で返します (たとえば、コード内でとの両方を検索できます)。termresponsevaluedescription

たとえば、大まかに:

$("some selector").autocomplete({
    // ...other options...
    source: function(request, response) {
        var matches = [];
        /* ...search for matches in your data using `request.term`,
           add them to `matches`...
        */
        response(matches);
    }
});

返される配列は、単なる文字列の場合もあればvaluelabelプロパティを持つオブジェクトの場合もあります。labelが表示され、value選択すると が使用されます。

たとえば、これは空港の (短い) リストを使用したもので、入力するとvalue(空港コード) とdescription(空港名)の両方がチェックされますソース

jQuery(function($) {
  var data = [
    {value: "ORD", description: "Chicago O'Hare"},
    {value: "LHR", description: "London Heathrow"},
    {value: "SFO", description: "San Francisco International"}
  ];

  $("#theInput").autocomplete({
    source: function(request, response) {
      var capterm = request.term.toUpperCase();
      var matches = $.map(data, function(entry) {
        if (entry.value.toUpperCase().indexOf(capterm) !== -1 ||
            entry.description.toUpperCase().indexOf(capterm) !== -1) {
          return {
            value: entry.value,
            label: entry.value + " - " + entry.description
          };
        }
      });
      response(matches);
    }
  });
});

したがって、「or」または「chic」と入力すると「ORD - Chicago O'Hare」が表示され、それを選択すると「ORD」がフィールドに入力されます。「san」または「sfo」と入力すると「SFO - San Francisco International」が表示され、それを選択すると「SFO」がフィールドに入力されます。

于 2012-07-24T14:52:58.350 に答える