我正在使用以下淘汰验证插件:
https://github.com/Knockout-Contrib/Knockout-Validation
当我点击“提交”按钮时,我想验证我的字段,而不是每当我更改输入值时.我怎样才能做到这一点?
使用Javascript:
ko.validation.init({ insertMessages:false,messagesOnModified:false,decorateElement: true,errorElementClass: 'wrong-field' },true); var viewmodel = { firstName: ko.observable().extend({minLength: 2,maxLength: 10}),lastName: ko.observable().extend({required: true}),age: ko.observable().extend({min: 1,max: 100}),submit: function() { if (viewmodel.errors().length === 0) { alert('Thank you.'); } else { alert('Please check your submission.'); viewmodel.errors.showAllMessages(); } },}; viewmodel.errors = ko.validation.group(viewmodel); ko.applyBindings(viewmodel);
HTML:
<fieldset> <div class="row" data-bind="validationElement: firstName"> <label>First name:</label> <input type="text" data-bind="textInput: firstName"/> </div> <div class="row" data-bind="validationElement: lastName"> <label>Last name:</label> <input data-bind="value: lastName"/> </div> <div class="row"> <div class="row"> <label>Age:</label> <input data-bind="value: age" required="required"/> </div> </div> </fieldset> <fieldset> <button type="button" data-bind='click: submit'>Submit</button> </fieldset>
这是我的jsfiddle:http://jsfiddle.net/xristo91/KHFn8/6464/
解决方法
好吧,是的,当观察者改变时,验证者会被解雇.但是……你可以使用验证器的onlyIf选项来欺骗你.
我做了一个 Fiddler sample它是如何工作的.
我做了一个 Fiddler sample它是如何工作的.
这里的问题更多……用户第一次点击后你想做什么….
基本上,示例将onlyIf条件放入所有验证器,而validateNow可观察,决定验证器何时应该按照您的意愿评估…在提交方法中.
self.validateNow = ko.observable(false);
在所有验证器上评估onlyIf:
self.firstName = ko.observable().extend({ minLength: { message:"minlength",params: 2,onlyIf: function() { return self.validateNow(); } },
并且仅在提交时设置validateNow
self.submit = function() { self.validateNow(true);
…我还重新调整了一些数据绑定,因为你的样本只会在输入上放置红色框.
我习惯用构造函数创建我的闭包.所以样本与你的“architecure”不一样,但我认为你会遗忘它