我有一个简单的 select2 框,它加载了一个下拉菜单。
但是,每次使用 AJAX 调用的结果打开选择菜单时,重新加载下拉菜单的最佳方法是什么? ajax 调用将返回
<option value=1>
<option value=2>
等等
我已经查看了 select2 文档中的 AJAX 示例,但它看起来有点过于复杂,无法满足我的需要。 时间差
最佳答案
假设你有html
<p>
Hidden field value set in the following format:
<br />
<em>'34:Donnie Darko,54:Heat,27:No Country for Old Men'
</em></p>
<input type='hidden' id="e6" style="width: 500px;" value="34:Donnie Darko,54:Heat,27:No Country for Old Men" />
<br /> <button id="save">Save</button>
<p>
After it's initialised, the hidden field value will change to:<br />
<em>'34,54,27'</em>
<br />
That is the value sent to the server
</p>
和 select2 Ajax
function MultiAjaxAutoComplete(element, url) {
$(element).select2({
placeholder: "Search for a movie",
minimumInputLength: 1,
multiple: true,
id: function(e) { return e.id+":"+e.title; },
ajax: {
url: url,
dataType: 'json',
data: function(term, page) {
return {
q: term,
page_limit: 10,
apikey: "z4vbb4bjmgsb7dy33kvux3ea" //my own apikey
};
},
results: function(data, page) {
alert(data);
return {
results: data.movies
};
}
},
formatResult: formatResult,
formatSelection: formatSelection,
initSelection: function(element, callback) {
var data = [];
$(element.val().split(",")).each(function(i) {
var item = this.split(':');
data.push({
id: item[0],
title: item[1]
});
});
//$(element).val('');
callback(data);
}
});
};
function formatResult(movie) {
return '<div>' + movie.title + '</div>';
};
function formatSelection(data) {
return data.title;
};
MultiAjaxAutoComplete('#e6', 'http://api.rottentomatoes.com/api/public/v1.0/movies.json');
$('#save').click(function() {
alert($('#e6').val());
});
尝试用这个进行多 ajax 调用! 引用 - http://jsfiddle.net/JpvDt/112/
关于javascript - Select2 下拉列表如何通过 AJAX 加载结果,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13362184/