Skip to content

OLD METHOD | Creating your own re usable custom validation types

nelsonomuto edited this page Dec 21, 2014 · 1 revision

To create your own re-usable validation types within your project source follow these simple 4 steps after angular-ui-form-validation is installed.

See Video

##Step One Create a javascript file and place it anywhere appropriate to you within your source, I recommend in the directory you have your directives stored. ##Step Two Name this file whatever you want and paste the following code into it:

    var extendCustomValidations = angular.module('directives.<fileName>', [
        'directives.customvalidation.customValidations'
    ]);

    getValidationAttributeValue = angular_ui_form_validations.getValidationAttributeValue;

    angular.forEach([
            {
                customValidationAttribute: 'validationPIsRequired', //This is a sample, replace with your own validation
                errorMessage: 'The letter "P" is required',
                validator: function (errorMessageElement, val){
                    return (/p/i).test(val);
                }
            }
            /*
            ,{
                Add more validations to this array as necessary
            }
             */
        ],

        function(customValidation) {
            extendCustomValidations.directive('input', function (customValidationUtil) {
                return {
                    require: '?ngModel',
                    restrict: 'E',
                    link: customValidationUtil.createValidationLink(customValidation)
                };
            });
        });
})();

##Step Three Ensure that you include this file right after the script tag for angular-ui-form-validation in your index.html file.

##Step Four Inject the dependency in your app module

##Done! You may now test your custom re-usable validation directive