Hi,
Breeze zValidate directive offers simple validation in which it display red border around the invalid input and so on. I would like to replace it with Kendo UI validator but only the UI part. I would like to keep the validation rules from the zDirective. So the validation logic will work as follow:
1. A numeric input text box
1.
<
td
><
input
kendo-numeric-text-box
spinners
=
"false"
ng-model
=
"r.incomeReturn"
data-z-validate /></
td
>
1. When users enter/change the value, zdirective error handler valErrsChanged(newValue) will run:
01.
function
valErrsChanged(newValue) {
02.
if
(domEl.setCustomValidity) {
03.
domEl.setCustomValidity(newValue ||
''
);
04.
}
05.
06.
var
errorHtml = newValue ? valTemplate.replace(/%error%/, newValue) :
""
;
07.
var
isRequired = info.getIsRequired();
08.
var
requiredHtml = isRequired ? requiredTemplate :
''
;
09.
decorator.innerHTML = (isRequired || !!errorHtml) ? requiredHtml + errorHtml :
""
;
10.
11.
}
2. Replace to Validation logic above with the following logic:
2.1 Make the current input border red but do not display any validation error message.
2.2 When users hover the input, it will display a tooltip with the validation message