Question

我是淘汰赛的新人，觉得我可能不会在这里理解一些东西。我基本上有一个MVC复选框，当检查时将更新另一个依赖于其他字段计算的字段。我可以获取除了复选框之外的所有其他字段的总金额字段，并且我不确定我做错了什么。我怀疑它是因为我没有传递self，但我不确定如何用最终等式中的条件值传递它，但是我＆＃ 39;我不确定为什么会出现这种情况。也许有人可以对此有所了解。

我还注意到，如果我对变量进行计算并返回最终变量，初始值将正确显示，但是没有任何东西可以使最终的字段更新。有没有理由这样或者我做错了什么？

这是我使用

的复选框标记

<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>

这是我的knockoutjs视图模型

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());

Answer 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属性的包装器对象。

复选框没有更新值淘汰赛js

1 个答案: