Knockout JS Флажок Список не обязателен - PullRequest
Новая
       6

Knockout JS Флажок Список не обязателен

1 голос
/ 06 марта 2020

У меня проблема с тем, что мой список флажков не является обязательным при загрузке данных с сервера.

Итак, у меня есть таблица, в которой вы выбираете клиента, когда я нажимаю кнопку редактирования, всплывающее окно bootstrap со всеми информационными полями, такими как имя, фамилия и c.

Теперь пара этих полей - списки флажков. Все заполняется правильными данными, кроме этих двух полей. Ниже приведен текущий код одного из списков. 

<div class="row">
    <div class="col-25">
        <label for="referralSource">Referral Source</label>
    </div>
    <div class="col-75">
        <ul class="kolist" data-bind="foreach: $root.sources">
            <li>
                <input type="checkbox" data-bind="
                    checkedValue: id,
                    checked: $root.currentClient.ReferralSourceIDs
                " />
                <label style="margin: 0px; padding: 0px;" data-bind="
                    text: source,
                    attr: {for: source}
                "></label>
            </li>
        </ul>
    </div>
</div>

Этот код должен связывать данные с currentClient, который находится в модели представления. 

self.currentClient = ko.observable();

При нажатии кнопки редактирования currentClient заполнен правильными данными. 

editClient = function (editingClient) {

    self.currentClient(editingClient);
}

Данные, которые мы получаем из базы данных, заполняют класс ReferralSource. 

function ReferralSource(id, source) {
    this.id = ko.observable(id);
    this.source = ko.observable(source);

    return this;
}
clientsLoad = function () {
    $.ajax({
        contentType: 'application/json',
        type: "GET",
        url: baseUrl + 'api/Client/LoadAll',
        dataType: 'json',
        context: this,
        success: function (data, textStatus, jqXHR) {
            self.clients($.map(data, function (item) {
                var referralSources = new Array();
                for (var i = 0; i < item.ReferralSourceIDs.length; i++) {
                    referralSources.push(
                        new ReferralSource(
                            item.ReferralSourceIDs[i].ReferralSourceID,
                            item.ReferralSourceIDs[i].Source
                        )
                    );
                }                    
                return new Client(
                    item.FirstName,
                    item.LastName, /* etc */
                    referralSources
                );
            }));
        }
    });
}

Таким образом, все сказанное означает, что данные загрузки При правильной работе редактирование в select заполняется правильными данными, но единственная проблема заключается в том, что флажки не устанавливаются при привязке. Кто-нибудь может увидеть что-то, чего мне не хватает, или я делаю что-то не так. Если вам нужна дополнительная информация, пожалуйста, спросите, я постараюсь сделать так, чтобы это работало.

РЕДАКТИРОВАТЬ: Итак, я нашел способ заставить его работать, и он должен иметь дело с этой частью кода. 

<input type="checkbox" data-bind="checkedValue: id, checked: $root.currentClient.ReferralSourceIDs" />

Не нравится $root.currentClient.ReferralSourceIDs. Я удалил это из класса и поместил в модель представления, и оно начало работать. Так это выглядит сейчас $root.referralSources. Я понятия не имею, почему, но это работает таким образом. Поэтому, если у кого-то есть какие-либо другие решения, пожалуйста, дайте мне знать, пока я буду придерживаться этого.

...