不确定如何使用JQuery UI自动完成... :( [英] Not sure how to use the JQuery UI Autocomplete ... :(
问题描述
这一次,我要返回数据...但是我不知道如何我定义要显示的html以及如何用结果动态更新该html.
This time, I have my data returning ... but I have no idea how i define what html to show and how to dynamically update that html with my results.
所以,这是我的jquery....
So, here's my 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
<script type="text/javascript">
$(document).ready(function () {
AutoComplete("#searchQuestion");
})
</script>
现在..我不确定我如何告诉它使用一些html/div/etc. ...然后填充该<ul>
列表(我假设我在..上方扩展了回调,而不是调用此response(data)
方法.. wtf是吗?)
Now .. i'm not sure how i tell it to use some (yet to be made) html/div/etc. ... and then to populate that <ul>
list (i'm assuming i extend the callback, above .. instead of calling this response(data)
method .. wtf is that?)
推荐答案
这是我的jQuery UI自动完成功能的工作示例.希望对您有所帮助:
Here's my working example of jQuery UI's autocomplete. Hope it helps:
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上设置一个断点,然后看看会发生什么.
If you're not doing so by now, get Firebug. It's an invaluable tool for web development. You can set a breakpoint on this JavaScript and see what happens.
这篇关于不确定如何使用JQuery UI自动完成... :(的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!