在淘汰赛验证错误或成功时添加或删除元素

Question

我有一个konockout验证：

define([
    "jquery",
    "knockout",
    "knockout.validation",
    "inte/accdevice"
], function ($, ko, validation) {
    return function (model, getzipcodeurl) {
        $(function () {

            ko.validation.registerExtenders();


            function ViewModelprofile() {
                var self = this;
                self.firstName = ko.observable(model.FirstName).extend({ required: { message: errors} });
                self.updating = ko.observable(true);
            };

            var vms = new ViewModelprofile();


            vms.errors = ko.validation.group(vms);

            ko.applyBindingsWithValidation(vms, document.getElementById('infosBlocEdit'), { messagesOnModified: true });
        });
    };
});

这是我的HTML：

 <input id="FirstName" name="FirstName" type="text" value="@Model.FirstName" data-bind="value: firstName" maxlength="19" />
                        <span class="errorMsg" data-bind="validationMessage: firstName"></span>

实际上当我显示错误时：<span class="errorMsg" data-bind="validationMessage: firstName">errors</span>

我需要在错误和每个元素验证成功时个性化css：

如有错误，我需要显示：<span class="invalidLine"> <span class="bble">&nbsp;</span> <span class="bbleTxt">errors</span> </span>

和成功：<span class="validLine"></span>

我该怎么做？

Answer 1

如果我正确理解了这个问题，并且从我看到你使用敲除验证，你需要像：

<span class="invalidLine" data-bind="visible: !firstName.isValid()">
    <span class="bble">&nbsp;</span>
    <span class="bbleTxt">errors</span>
</span>
<span class="validLine" data-bind="visible: firstName.isValid()"></span>