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. 
  */

]

我确实在这里看到了这个其他 SO 问题/答案,我认为我在确保正确配置 term 参数方面做的一切都是正确的。我想认为修复很容易,但不确定。

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