javascript 在 Select2 中获取和缓存结果
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17037766/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Fetching and caching the result in Select2
提问by Fizer Khan
My application uses select2to show list of names which is retrieved through Ajax call. It uses select2 ajax functionalities.
我的应用程序使用select2来显示通过 Ajax 调用检索的名称列表。它使用 select2 ajax 功能。
But the problem is that select2fetches items whenever i type on the select2input. I dont want to fetch every time user type. I want to fetch items in the initial loading of select2and then uses same data even if they typing in the select2 input.
但问题是，每当我在select2输入上键入时，select2 都会获取项目。我不想每次用户输入时都获取。我想在select2的初始加载中获取项目，然后使用相同的数据，即使他们在 select2 输入中输入。
How can i achieve this?
我怎样才能做到这一点？
PS: I have seen cache flag in Ajax, but i think it does caching the result based on the URL. It does not stop fetching of data when user type on the select2 input.
PS：我在 Ajax 中看到了缓存标志，但我认为它确实根据 URL 缓存了结果。当用户在 select2 输入上键入时，它不会停止获取数据。
回答by Hemant Thorat
Select2 load data using ajax with caching in-place.
Select2 使用带有就地缓存的 ajax 加载数据。
$("#selIUT").select2({
cacheDataSource: [],
placeholder: "Please enter the name",
query: function(query) {
self = this;
var key = query.term;
var cachedData = self.cacheDataSource[key];
if(cachedData) {
query.callback({results: cachedData.result});
return;
} else {
$.ajax({
url: '/ajax/suggest/',
data: { q : query.term },
dataType: 'json',
type: 'GET',
success: function(data) {
self.cacheDataSource[key] = data;
query.callback({results: data.result});
}
})
}
},
width: '250px',
formatResult: formatResult,
formatSelection: formatSelection,
dropdownCssClass: "bigdrop",
escapeMarkup: function (m) { return m; }
});
I hope you find it helpful.
我希望你觉得这对你有帮助。
回答by Tony Brix
I got caching to work with paging.
我得到了缓存来处理分页。
query: function (query) {
var id = this.element[0].id;
var term = query.term;
var total = 100;
if (!window.select2cache[id]) {
window.select2cache[id] = {};
}
if (!window.select2cache[id][term]) {
window.select2cache[id][term] = {
results: {
results: [],
more: false
},
pages: 0
};
}
if (window.select2cache[id][term].pages > 0 && query.page === 1) {
query.callback(window.select2cache[id][term].results);
} else {
var page = window.select2cache[id][term].pages + 1;
var vars = {
task: id,
q: term,
page: page,
total: total
};
$.get("./autocomplete.php", vars, function (data) {
var more = (page * total) < data.totalrows;
window.select2cache[id][term].results.results = window.select2cache[id][term].results.results.concat(data.results);
window.select2cache[id][term].results.more = more;
window.select2cache[id][term].pages = page;
query.callback({results: data.results, more: more});
}, "json");
}
}
I use the idso you can have multiple select2's on the same page and cache them seperately.
我使用id以便您可以在同一页面上有多个 select2 并分别缓存它们。
