使用$ .MAP功能jQuery用户界面自动完成缓存 [英] jQuery UI autocomplete caching using $.map function
本文介绍了使用$ .MAP功能jQuery用户界面自动完成缓存的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我想实现使用jQuery UI自动完成缓存。
我使用jQuery 1.4.4和1.8.6的用户界面
I am trying to implement caching using jQuery UI autocomplete. I am using jQuery 1.4.4 and UI 1.8.6
下面是基本的code,我得到了工作:
Here is the basic code that I got working:
$('#searchbox').autocomplete({
source: function(request, response) {
if (xhr === lastXhr) {
response( $.map(data, function(item) {
return {
label: item.NAME + (item.PRFNM ? ' (' + item.PRFNM + ')' : '') + ', ' + item.JOBTITLE,
value: item.NAME
};
}));
}
});
}
});
下面是我试图让缓存从看的例子:
Here is my attempt to get caching to work from looking at the example:
var cache = {},
lastXhr;
$('#searchbox').autocomplete({
source: function(request, response) {
var term = request.term;
if (term in cache) {
response($.map(cache[term], function(item) {
return {
label: item.NAME + (item.PRFNM ? ' (' + item.PRFNM + ')' : '') + ', ' + item.JOBTITLE,
value: item.NAME
};
}));
}
lastXhr = $.getJSON( "getdata.php", request, function(data, status, xhr) {
cache[term] = $.map(data, function(item) {
return {
label: item.NAME + (item.PRFNM ? ' (' + item.PRFNM + ')' : '') + ', ' + item.JOBTITLE,
value: item.NAME
};
});
if (xhr === lastXhr) {
response( $.map(data, function(item) {
return {
label: item.NAME + (item.PRFNM ? ' (' + item.PRFNM + ')' : '') + ', ' + item.JOBTITLE,
value: item.NAME
};
}));
}
});
}
});
任何考生在那里?
Any takers out there?
推荐答案
下面是一个使用缓存jQuery用户界面的自动完成的工作我的例子
。希望它可以帮助:
Here's my working example of jQuery UI's autocomplete using cache
. 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
}
}
});
如果你不是现在这样做,得到的 萤火虫 。它是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.
这篇关于使用$ .MAP功能jQuery用户界面自动完成缓存的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文