设置依赖于其他字段的验证

本文关键字：验证 字段 其他 依赖于 设置 | 更新日期: 2023-09-27 18:31:41

我有一个名为ReclaimTotalAmount的字段，它显示来自c#模型的值。

<div class="container-left">
Reclaim Total: <span data-bind='text: model.ReclaimTotalAmount'></span>
</div>

我还有一个字段显示字段总和的值：

 <div class="container-left">
    Countered Total:<span data-bind='text: model.CounteredTotalAmount'></span>
</div>

为了获得计数器总金额，我使用以下方法

self.model.CounteredTotalAmount = ko.computed(function () {
    var SumCounterTotals = 0;
    for (var i = 0; i < self.model.CounterReclaimViewModels().length; i++) {
        SumCounterTotals += (
           parseFloat(self.model.CounterReclaimViewModels()[i].CounteredTimeAmount())
         + parseFloat(self.model.CounterReclaimViewModels()[i].CounteredMileAmount())
         + parseFloat(self.model.CounterReclaimViewModels()[i].CounteredAppurtenanceAmount())
     )
    }

所以我需要检查天气反击总数大于回收总数。我试过这个：我创建了一个扩展 

 self.model.CounteredTotalAmount.extend({
    greaterThan: { params: self.model.ReclaimTotalAmount, message: "Car number high must be greater than the low." }
});

那么这就是函数

 ko.validation.rules['greaterThan'] = {
    validator: function (val, other) {
        if (val != null && val != "" && other != null) {
            var first = parseInt(val);
            var second = parseInt(ko.unwrap(other));
            if (!isNaN(first) && !isNaN(second)) {
                return first > second;
            }
        }
        return true;
    },
    message: 'Must be greater than or equal to the other value'
};

除了验证之外，一切都有效。如果计数器总数大于回收总数，我无法生成错误消息...谢谢

设置依赖于其他字段的验证

多个事情可能会出错，但是由于您尚未发布完整的示例，因此仅代码片段，因此您需要检查以下事项：

  1. 由于您正在创建自定义验证程序，因此您需要在首次使用它之前调用ko.validation.registerExtenders();。

  2. KO .extend({ })返回扩展的可观察量，因此您需要使用结果覆盖现有属性：

    self.CounteredTotalAmount = self.CounteredTotalAmount.extend({
    greaterThan: {
       params: self.ReclaimTotalAmount,
       message: "Car number high must be greater than the low."
    }
});

  3. 因为KO验证仅覆盖value和checked绑定以自动显示错误消息。因此，您需要使用 validationMessage 绑定来显示错误，因为您在此处使用的是 text 绑定：

    <div class="container-left">
     Countered Total:<span data-bind='text: CounteredTotalAmount'></span>
     <span data-bind="validationMessage: CounteredTotalAmount"></span>
</div>

下面是一个工作 JSFiddle，其中包含代码的简化版本。

相关文章：