我正在使用带有Knockout的durandal / breeze.
我正在使用ko.validation对输入进行验证.
这是一个经典:
<input type="text" data-bind="value: myDate,validationOptions: { errorElementClass: 'input-validation-error'}" /> .input-validation-error { background-color: #c75b55 !important; }
这个工作得很好:当验证失败时,输入文本框标记为红色.
现在我想使用bindingHandlers代替’简单’值绑定:
<input type="text" data-bind="dateRW: myDate,validationOptions: { errorElementClass: 'input-validation-error'}" /> ko.bindingHandlers.dateRW = { //dateRW --> the 'read-write' version used both for displaying & updating dates init: function (element,valueAccessor,allBindingsAccessor) { var observable = valueAccessor(); //handle the field changing ko.utils.registerEventHandler(element,"change",function () { var value = $(element).val(); var dateFormatted = moment.utc(value,"DD/MM/YYYY"); //if (dateFormatted.isValid()) if (dateFormatted) observable(dateFormatted.toDate()) else observable(null); }); },update: function (element,allBindingsAccessor) { var value = ko.utils.unwrapObservable(valueAccessor()); var date = (typeof value !== 'undefined') ? moment.utc(value) : null; var dateFormatted = (date != null) ? date.format('DD/MM/YYYY') : ''; $(element).val(dateFormatted); } };
有了这个实现,验证工作,我的意思是ko.validation.group运行良好
var validationErrorsCount = ko.computed(function() { if (typeof itinerary() == 'undefined') return; var validationErrors = ko.validation.group(itinerary()); return validationErrors().length; });
但输入文本框不再以红色标记.似乎’validationOptions’仅适用于值绑定.
有什么方法让我的验证工作?
谢谢.
解决方法
验证框架具有值绑定的钩子,您需要调用
ko.validation.makeBindingHandlerValidatable("dateRW");
编辑:它没有未定义
https://jsfiddle.net/it3xl/n7aqjor9/