Флажок не обновляет значение нокаута JS

Я новичок в нокауте и чувствую, что, возможно, я чего-то не понимаю. У меня в основном есть флажок MVC, который при проверке обновит другое поле, которое зависит от других вычислений поля. Я могу получить поле общей суммы для обновления по отношению ко всем другим полям, кроме флажка, и я не уверен, что я делаю неправильно. Я подозреваю, что это потому, что я не прохожу в self, но я не уверен, как бы передать это с условным значением в конечном уравнении, но я не уверен, почему это вообще так. Может быть, кто-то мог бы пролить свет на это.

Я также заметил, что если я сделаю вычисления в переменные и верну окончательную переменную, начальное значение будет отображаться правильно, но тогда ничто не приведет к обновлению окончательного поля. Есть ли причина, по которой это так, или, может, я что-то не так делаю?

Вот чекбокс, который я использую

<div class="form-group-sm">
    <label for="bookingType">International Property</label>
    <div class="checkbox">
        @Html.EditorFor(model => model.IsInternationalProperty, new { @id = "internationalProperty", @value = true, @data_bind = "checked: internationalProperty" })
        <label style="width: 200px; text-align: left">Select if it is outside the US</label>
    </div>
</div>

А вот и моя модель просмотра knockout js

var viewModel = function (data) {
    var self = this;
    self.internationalProperty = ko.observable();
    self.vendorBookingAmount = ko.observable(2.00);
    self.transactionFeesDue = ko.observable(0.00);
    self.transactionFeesWaived = ko.observable(0.00);
    self.iceBookingFees = ko.observable(0.00);
    self.vacationCashRedeemed = ko.observable(0.00);
    self.pointsDiscount = ko.observable(0.00);
    debugger;
    var international = (self.internationalProperty() == true) ? 0.05 : 0;

    self.memberBalance = ko.computed(function () {
        return (Number(self.vendorBookingAmount()) + Number(self.transactionFeesDue()) -
            Number(self.transactionFeesWaived()) + Number(self.iceBookingFees()) -
            Number(self.vacationCashRedeemed()) - Number(self.pointsDiscount())) +

            (Number(self.vendorBookingAmount()) + Number(self.transactionFeesDue()) -
            Number(self.transactionFeesWaived()) + Number(self.iceBookingFees()) -
            Number(self.vacationCashRedeemed()) - Number(self.pointsDiscount()))*international;
    }, self);
};

ko.applyBindings(new viewModel());

1 ответ

Решение

Вам нужно поставить расчет international переменная внутри memberBalance. Прямо сейчас вы рассчитываете это только один раз, а затем memberBalance использует тот же international значение

    self.memberBalance = ko.computed(function () {
        var international = (self.internationalProperty() == true) ? 0.05 : 0;
        return (Number(self.vendorBookingAmount()) + Number(self.transactionFeesDue()) -
            Number(self.transactionFeesWaived()) + Number(self.iceBookingFees()) -
            Number(self.vacationCashRedeemed()) - Number(self.pointsDiscount())) +

            (Number(self.vendorBookingAmount()) + Number(self.transactionFeesDue()) -
            Number(self.transactionFeesWaived()) + Number(self.iceBookingFees()) -
            Number(self.vacationCashRedeemed()) - Number(self.pointsDiscount()))*international;
    }, self);

РЕДАКТИРОВАТЬ: Если вы просматриваете источник и смотрите на ваш сгенерированный HTML, вы увидите, что data-bind Заявление просто не существует для флажка. Проблема в том, что @Html.EditorFor имеет разные параметры от @Html.CheckBoxFor, @Html.TextBoxFor и т.п.

Смотрите сообщение: http://cpratt.co/html-editorfor-and-htmlattributes/

Синтаксис, который вам нужно использовать:

@Html.EditorFor(model => model.IsInternationalProperty, new { htmlAttributes = new { @id = "internationalProperty", @value = true, @data_bind = "checked: internationalProperty" } })

Обратите внимание на объект-оболочку со свойством htmlAttributes.

Другие вопросы по тегам