Получить все элементы в раскрывающемся списке select2, используя JavaScript, куда данные загружаются из вызова ajax - PullRequest
0 голосов
/ 09 декабря 2018

Пример, который я хотел бы повторить, таков: 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.У кого-нибудь есть идеи, как решить эту проблему?

...