0

テスト サイトhttp://karem.kaidez.com/で、オートコンプリート ウィジェットを使用して jQueryUI を利用した検索を構成しました。データは.jsonファイルによって入力されており、検索ボックスに入力した内容に基づいてフィルター処理されると予想していたときに、すべての結果が表示されています。

検索ボックスは、次のように HTML に埋め込まれます。

<input type="text" id="searchfield" class="searchfield-style" placeholder="Search..." />

具体的な jQueryUI コードは次のようになります。

  define("search", ["jquery","jqui"], function($, jqui) { //running via RequireJS
  $("#searchfield").autocomplete({
    source: function( request, response ) {
      $.ajax({
        url: "search.json",
        dataType: "json",
        data: {term: request.term},
        success: function(data) {
          response($.map(data, function(item) {
            return {
              label: item.title
            };
          }));
        }
      });
    },
    minLength: 0,
    select: function(event, ui) {
     //code comes later
    }
  });
});

search.json次のようになります。

[

  {
    "title":"lorem",
    "url":"/lorem/"
  },

  {
    "title":"ipsum",
    "url":"/ipsum/"
  },

 false
 /*
  * This 'false' is here because the JSON file is being built via a Jekyll 
  * plugin and adding commas at the end of the final key/value pait.
  * Adding 'false' makes the file valid JSON. 
  */

]

this other SO question/answer hereを見ましたが、用語パラメーターが適切に構成されていることを確認するという点ですべてが正しいと思います。修正は簡単だと思いたいのですが、よくわかりません。

4

1 に答える 1

0
try this

    ('#searchfield').autocomplete({
        source: function( request, response ) {
  $.ajax({
    url: "search.json",
    dataType: "json",
    data: {term: request.term},
    success: function(data) {
      response($.map(data, function(item) {
        return {
          label: item.title
        };
      }));
    }
  });
},
        minLength: 2,
        search: function(oEvent, oUi) {
            var selectedValue = $(oEvent.target).val();
            var aSearch = [];
            $('source').each(function(index, value) {
                if (value.substr(0, selectedValue .length) == selectedValue ) 
                    aSearch.push(value);               
            });

            $(this).autocomplete('option', 'source', aSearch);
        }
    });
于 2013-05-19T00:21:59.880 に答える