Пример, который я хотел бы повторить, таков: https://jsfiddle.net/bindrid/hpkqxto6/.Мне нужно загрузить данные с сервера, сформировать их группу, и при выборе одного элемента из одной группы все остальные элементы в этой конкретной группе будут отключены.Разница в том, что я должен загружать данные с сервера, используя ajax-вызов внутри select2, вместо того, чтобы перечислять элементы
внутри элемента select и формировать группировку таким образом.У меня проблемы с выбором всех доступных элементов в раскрывающемся списке во время манипуляций с javascript, чтобы отключить элементы из той же группы (строка 29 в приведенном выше примере завершается сбоем из-за отсутствия элементов в html, вместо этого я думаю, что они загруженыпозже, и javascript не может их найти).
html-часть выглядит следующим образом:
<select class="form-control attributoSelect2" name="attributiSelezionati" id="attributoSelect2" value="@Model.AttributiSelezionati"></select>
Внутри
$('.attributoSelect2').select2({
placeholder: "Cerca Attributo",
multiple: true,
allowClear: true,
minimumInputLength: 0,
ajax: {
dataType: 'json',
delay: 150,
url: "@Url.Action(MVC.Configurazione.Attributi.CercaAttributi())",
data: function (params) {
return {
search: params.term
};
},
processResults: function (data) {
return {
results: data.map(function (item) {
return {
id: item.Id,
text: item.Descrizione,
children: item.Children.map(function (itemC) {
return {
id: itemC.Id,
groupid: itemC.GroupId,
text: itemC.Descrizione,
};
})
};
})
};
}
}
});
Наконец, мой JavaScript выглядит следующим образом:
$('.attributoSelect2').on("select2:selecting", function (evt, f, g) {
disableSel2Group(evt, this, true);
});
$('.attributoSelect2').on("select2:unselecting", function (evt) {
disableSel2Group(evt, this, false);
});
function disableSel2Group(evt, target, disabled) {
var selId = evt.params.args.data.id;
var group = evt.params.args.data.groupid;
var aaList = $(".attributoSelect2 option");
$.each(aaList, function (idx, item) {
var data = $(item).data("data");
var itemGroupId = data.groupid;
if (itemGroupId == group && data.id != selId) {
data.disabled = disabled;
}
})
}
Проблема в том, что эта строка:
var aaList = $(".attributoSelect2 option");
делаетне загружать все элементы option, потому что они еще не загружены.Они будут загружены позже с помощью вызова ajax.У кого-нибудь есть идеи, как решить эту проблему?