Question

我认为我已正确配置了大部分内容。我可以调试并看到订阅选项正在解雇，但似乎没有任何改变......

在我的viewmodel中我有：

ko.validation.init({
    errorElementClass: 'has-error',
    errorMessageClass: 'help-block',
    decorateInputElement: true
}, true);

ko.extenders.required = function (target, overrideMessage) {
    //add some sub-observables to our observable
    target.hasError = ko.observable();
    target.validationMessage = ko.observable();

    //define a function to do validation
    function validate(newValue) {
        target.hasError(newValue ? false : true);
        target.validationMessage(newValue ? "" : overrideMessage || "This field is required");
    }

    //initial validation
    validate(target());

    //validate whenever the value changes
    target.subscribe(validate);

    //return the original observable
    return target;
};

var validationMapping = {
    usr_login: {
        create: function (options) {
            return ko.observable(options.data).extend({ required: "Please enter a login for the user" });
        }
    };

我这样做我的数据调用：

return dc.getSingleUser(node.data.userID)
    .then(function (data) {
    self.selectedUser(mapping.fromJS(data, validationMapping)); //use mapping
})

视图有：

<div class="form-group" data-bind="validationElement: selectedUser().usr_login">
      <label class="col-sm-2 control-label">User Login</label>
      <div class="col-sm-10">
         <input type="text" data-bind="enable: inEditMode, value:selectedUser().usr_login" class="form-control" placeholder="User login">
     </div>
</div>

所有调试点似乎都被点击，它成功返回一个＆＃34; false＆＃34;当我将该字段留空时，从订阅方法，但"has-error"标记似乎永远不会出现在任何地方。

知道我做错了吗？

编辑1：它与custom extender有关。

在绝望中，我注释掉了上面的ko.extenders.required功能，并立即开始工作。所以我想问题是......上面的自定义函数有什么问题？

我注意到我提供的自定义消息被忽略了。

我只是"this field is required"而不是"please enter a login for this user"。

编辑2：

现在正在使用此功能而不使用自定义扩展程序。

<div class="form-group" data-bind="validationElement: selectedUser().usr_login">
     <label class="col-sm-2 control-label">User Login</label>
     <div class="col-sm-10">
          <input type="text" data-bind="enable: inEditMode, value:selectedUser().usr_login" class="form-control" placeholder="User Name">
     </div>
</div>

和

var validationMapping = {
    usr_login: {
        create: function (options) {
            var self = this;
            return ko.observable(options.data).extend({ required: { params: true, message: 'You must enter a login name for the user.' } });
        }
    }
};

Answer 1

现在正在使用此功能而不使用自定义扩展程序。

<div class="form-group" data-bind="validationElement: selectedUser().usr_login">
     <label class="col-sm-2 control-label">User Login</label>
     <div class="col-sm-10">
          <input type="text" data-bind="enable: inEditMode, value:selectedUser().usr_login" class="form-control" placeholder="User Name">
     </div>
</div>

和

var validationMapping = {
    usr_login: {
        create: function (options) {
            var self = this;
            return ko.observable(options.data).extend({ required: { params: true, message: 'You must enter a login name for the user.' } });
        }
    }
};

使用bootstrap进行淘汰验证 - 无法获得错误＆＃39;要附加到元素

1 个答案: