不知道如何使用JQuery UI Autocomplete …… :(

我问，这是以前的JQueryUI Autocomplete问题的延续。

这一次，我有我的数据返回…但我不知道我如何定义要显示的HTML以及如何使用我的结果动态更新该html。

所以，这是我的jquery ….

Home.js

 function AutoComplete(element) { var cache = {}; $(element).autocomplete({ minLength: 2, source: function (request, response) { if (request.term in cache) { response(cache[request.term]); return; } else { $.getJSON("/api/autocomplete/" + encodeURIComponent(request.term), function (data) { cache[request.term] = data; response(data); }); } } }); } 

这在我的视图中连接起来

Index.aspx

  $(document).ready(function () { AutoComplete("#searchQuestion"); })  

现在..我不知道我怎么告诉它使用一些（尚未制作）html / div / etc。 …然后填充那个

列表（我假设我扩展回调，上面..而不是调用这个response(data)方法.. wtf是吗？）

Answer 1

这是我的jQuery UI自动完成的工作示例。 希望能帮助到你：

  var cache = {}; $("#textbox").autocomplete({ source: function(request, response) { if (request.term in cache) { response($.map(cache[request.term].d, function(item) { return { value: item.value, id: item.id } })) return; } $.ajax({ url: "/Services/AutoCompleteService.asmx/GetEmployees", /* I use a web service */ data: "{ 'term': '" + request.term + "' }", dataType: "json", type: "POST", contentType: "application/json; charset=utf-8", dataFilter: function(data) { return data; }, success: function(data) { cache[request.term] = data; response($.map(data.d, function(item) { return { value: item.value, id: item.id } })) }, error: HandleAjaxError // custom method }); }, minLength: 3, select: function(event, ui) { if (ui.item) { formatAutoComplete(ui.item); // custom method } } }); 

如果你现在还没有这样做，请获取Firebug 。 它是Web开发的宝贵工具。 您可以在此JavaScript上设置断点，看看会发生什么。

Answer 2

这段代码对我有用：

 $( "#Textbox" ).autocomplete({ minLength: 2, source: function( request, response ) { var term = request.term; if ( term in cache ) { response( cache[ term ] ); return; } var currentProject=$("#project option:selected").text(); $.ajax({ url: "url", data: {term : request.term, IssueType :'Test', Project : currentProject}, dataType: "json", contentType: "application/json; charset=utf-8", dataFilter: function(data) { return data; }, success: function (data) { var results = $.map(data, function(item){ return { value: item.value, id: item.id }}); cache[request.term] = results; response(results); } }); } });