yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

updates a couple validators to use the nicer syntax but the other ones are more complex so we can't change them

Browse Source
This commit is contained in:
Shannon
2018-06-15 15:05:12 +10:00
parent 6d0307cdc7
commit 8b1c506fef
4 changed files with 21 additions and 150 deletions
Download Patch File Download Diff File Expand all files Collapse all files

123
src/Umbraco.Web.UI.Client/src/common/directives/validation/valCustom.directive.js
View File

@@ -1,123 +0,0 @@
/**
* General-purpose validator for ngModel.
* angular.js comes with several built-in validation mechanism for input fields (ngRequired, ngPattern etc.) but using
* an arbitrary validation function requires creation of a custom formatters and / or parsers.
* The ui-validate directive makes it easy to use any function(s) defined in scope as a validator function(s).
* A validator function will trigger validation on both model and input changes.
*
* @example <input val-custom=" 'myValidatorFunction($value)' ">
* @example <input val-custom="{ foo : '$value > anotherModel', bar : 'validateFoo($value)' }">
* @example <input val-custom="{ foo : '$value > anotherModel' }" val-custom-watch=" 'anotherModel' ">
* @example <input val-custom="{ foo : '$value > anotherModel', bar : 'validateFoo($value)' }" val-custom-watch=" { foo : 'anotherModel' } ">
*
* @param val-custom {string|object literal} If strings is passed it should be a scope's function to be used as a validator.
* If an object literal is passed a key denotes a validation error key while a value should be a validator function.
* In both cases validator function should take a value to validate as its argument and should return true/false indicating a validation result.
*/
/*
This code comes from the angular UI project, we had to change the directive name and module
but other then that its unmodified
*/
angular.module('umbraco.directives.validation')
.directive('valCustom', function () {
return {
restrict: 'A',
require: 'ngModel',
link: function (scope, elm, attrs, ctrl) {
var validateFn, watch, validators = {},
validateExpr = scope.$eval(attrs.valCustom);
if (!validateExpr){ return;}
if (angular.isString(validateExpr)) {
validateExpr = { validator: validateExpr };
}
angular.forEach(validateExpr, function (exprssn, key) {
validateFn = function (valueToValidate) {
var expression = scope.$eval(exprssn, { '$value' : valueToValidate });
if (angular.isObject(expression) && angular.isFunction(expression.then)) {
// expression is a promise
expression.then(function(){
ctrl.$setValidity(key, true);
}, function(){
ctrl.$setValidity(key, false);
});
return valueToValidate;
} else if (expression) {
// expression is true
ctrl.$setValidity(key, true);
return valueToValidate;
} else {
// expression is false
ctrl.$setValidity(key, false);
return undefined;
}
};
validators[key] = validateFn;
ctrl.$parsers.push(validateFn);
});
function apply_watch(watch)
{
//string - update all validators on expression change
if (angular.isString(watch))
{
scope.$watch(watch, function(){
angular.forEach(validators, function(validatorFn){
validatorFn(ctrl.$modelValue);
});
});
return;
}
//array - update all validators on change of any expression
if (angular.isArray(watch))
{
angular.forEach(watch, function(expression){
scope.$watch(expression, function()
{
angular.forEach(validators, function(validatorFn){
validatorFn(ctrl.$modelValue);
});
});
});
return;
}
//object - update appropriate validator
if (angular.isObject(watch))
{
angular.forEach(watch, function(expression, validatorKey)
{
//value is string - look after one expression
if (angular.isString(expression))
{
scope.$watch(expression, function(){
validators[validatorKey](ctrl.$modelValue);
});
}
//value is array - look after all expressions in array
if (angular.isArray(expression))
{
angular.forEach(expression, function(intExpression)
{
scope.$watch(intExpression, function(){
validators[validatorKey](ctrl.$modelValue);
});
});
}
});
}
}
// Support for val-custom-watch
if (attrs.valCustomWatch){
apply_watch( scope.$eval(attrs.valCustomWatch) );
}
}
};
});

12
src/Umbraco.Web.UI.Client/src/common/directives/validation/valcompare.directive.js
View File

@@ -9,14 +9,12 @@ angular.module('umbraco.directives.validation')
var otherInput = formCtrl[attrs.valCompare];
ctrl.$parsers.push(function(value) {
if(value === otherInput.$viewValue) {
ctrl.$setValidity("valCompare", true);
return value;
}
ctrl.$setValidity("valCompare", false);
});
//normal validator on the original source
ctrl.$validators.valCompare = function(modelValue, viewValue) {
return viewValue === otherInput.$viewValue;
};
//custom parser on the destination source with custom validation applied to the original source
otherInput.$parsers.push(function(value) {
ctrl.$setValidity("valCompare", value === ctrl.$viewValue);
return value;

32
src/Umbraco.Web.UI.Client/src/common/directives/validation/valemail.directive.js
View File

@@ -10,36 +10,32 @@ function valEmail(valEmailExpression) {
require: 'ngModel',
restrict: "A",
link: function (scope, elm, attrs, ctrl) {
var patternValidator = function (viewValue) {
function patternValidator(viewValue) {
//NOTE: we don't validate on empty values, use required validator for that
if (!viewValue || valEmailExpression.EMAIL_REGEXP.test(viewValue)) {
// it is valid
ctrl.$setValidity('valEmail', true);
//assign a message to the validator
ctrl.errorMsg = "";
return viewValue;
return true;
}
else {
// it is invalid, return undefined (no model update)
ctrl.$setValidity('valEmail', false);
//assign a message to the validator
ctrl.errorMsg = "Invalid email";
return undefined;
return false;
}
};
//if there is an attribute: type="email" then we need to remove those formatters and parsers
//if there is an attribute: type="email" then we need to remove the built in validator
// this isn't totally required but it gives us the ability to completely control the validation syntax so we don't
// run into old problems like http://issues.umbraco.org/issue/U4-8445
if (attrs.type === "email") {
//we need to remove the existing parsers = the default angular one which is created by
// type="email", but this has a regex issue, so we'll remove that and add our custom one
ctrl.$parsers.pop();
//we also need to remove the existing formatter - the default angular one will not render
// what it thinks is an invalid email address, so it will just be blank
ctrl.$formatters.pop();
ctrl.$validators = {};
}
ctrl.$parsers.push(patternValidator);
ctrl.$validators.valEmail = function(modelValue, viewValue) {
return patternValidator(viewValue);
};
}
};
}
@@ -51,4 +47,4 @@ angular.module('umbraco.directives.validation')
return {
EMAIL_REGEXP: emailRegex
};
});
});

4
src/Umbraco.Web.UI.Client/src/common/directives/validation/valrequirecomponent.directive.js
View File

@@ -1,7 +1,7 @@
(function() {
'use strict';
function ValRequireComponentDirective() {
function valRequireComponentDirective() {
function link(scope, el, attr, ngModel) {
@@ -33,6 +33,6 @@
return directive;
}
angular.module('umbraco.directives').directive('valRequireComponent', ValRequireComponentDirective);
angular.module('umbraco.directives').directive('valRequireComponent', valRequireComponentDirective);
})();