我正在尝试让 select2 使用多个预选选项。我用它来让用户选择几个选项，然后将它们保存下来，然后可以回来编辑它们。但是我无法让 select2 initSelection 正常工作以填充用户已经选择的现有选项。这是我尝试与警报一起使用的代码，以显示何时触发了某些内容，但是警报(“完成”)；尚未触发，并且 alert($(element).val(0) 触发两次。一次是输入中的值，然后是空白。
<input type="text" id="Commissioners" name="Commissioners" value="test" />
$("#Commissioners").select2({
placeholder: 'Select Commissioners',
minimumInputLength: 2,
allowClear: true,
multiple: true,
width: 'resolve',
ajax: {
url: "/Commissioner/CommissionerAutoComplete/",
dataType: 'json',
data: function (term, page) {
return {
search: term // search term
};
},
results: function (data) {
return { results: data };
}
},
initSelection: function (element, callback) {
// the input tag has a value attribute preloaded that points to a preselected make's id
// this function resolves that id attribute to an object that select2 can render
// using its formatResult renderer - that way the make text is shown preselected
alert($(element).val());
$.ajax({
url: "/UserProfile/LoadServiceTypeAndCommissioners",
type: "GET",
dataType: "json",
data: { UserId: '@Model.UserID', serviceTypeId: id}
}).done(function (data) {
alert("done");
callback(data.results);
});
},
formatResult: s2FormatResult,
formatSelection: s2FormatSelection
}).select2('val', []);
I figured out that the second alert fires for the .select2('val', []); at the end. however removing this causes the placeholder to not work and adding in a value here like ["1"] does not result in a selected item
最佳答案
事实证明，这是导致它无法正常工作的原因。我没有将 ajax 调用的代码作为 json 对象返回，但仅此一点并不能解决问题。我必须向 ajax 调用添加成功和错误选项，并在成功时进行回调。奇怪的是，我仍然需要保留 .done 及其回调。
$("#Commissioners").select2({
placeholder: 'Select Commissioners',
minimumInputLength: 2,
allowClear: true,
multiple: true,
width: 'resolve',
ajax: {
url: "/Commissioner/CommissionerAutoComplete/",
dataType: 'json',
data: function (term, page) {
return {
search: term // search term
};
},
results: function (data) {
return { results: data };
}
},
initSelection: function (element, callback) {
// the input tag has a value attribute preloaded that points to a preselected make's id
// this function resolves that id attribute to an object that select2 can render
// using its formatResult renderer - that way the make text is shown preselected
//alert($(element).val());
$.ajax({
url: "/UserProfile/LoadServiceTypeAndCommissioners",
type: "GET",
dataType: "json",
data: { UserId: '@Model.UserID', serviceTypeId: id },
success: function (data) {
callback(data);
},
error: function (data) {
}
}).done(function (data) {
callback(data.results);
});
},
formatResult: s2FormatResult,
formatSelection: s2FormatSelection
}).select2('val', ["1"]);
关于javascript - Select2 多个初始预选选项，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30080210/