Custom Validation functions

Since version 1.4.11

For a Custom Validation function (custom rules validation) to work, it is expected that you declare a custom function in your Controller which will return a boolean or an Object. Keep reading below to understand how to code your custom function.

If you want to create a custom function with Promise then you should probably look at the Wiki - Remote Validation (AJAX), it's the same implementation with promises.

####Demo You can find a Plunker Demo here #####Custom Validation function Please note that there is 2 ways of defining a custom error message that will be displayed if an error occur.

1. Use the :alt= (alternate text) message through the validator, example: validation="custom:myValidation:alt=Custom error"
2. Or define error message directly inside the custom function by returning an object instead of a boolean, example: myValidation() { return { isValid: false, message: 'custom error' }; }

The custom function declared in your controller could look like this.

vm.myCustomValidation1 = function() {
    var isValid = false;

    if(vm.model.input1 === "abc") {
      isValid = true;
    }

    // you can return a boolean for isValid or an objec (see the next function)
    // for this to work, you NEED to use the :alt= inside your validator
    return isValid;

    // or returned as an object if you want to include the custom error message
    // this mean that you returning the error message here INSTEAD of the :alt= 
    return { isValid: false, message: 'custom error' };
  }

####Directive

<!-- defining the remote function call by using `custom:` -->
<input type="text" class="form-control"
            name="input1"
            ng-model="vm.model.input1"
            validation="custom:myCustomValidation|required" />

<!-- or if you use the Controller As alias -->
<input type="text" class="form-control"
            name="input1"
            ng-model="vm.model.input1"
            validation="custom:vm.myCustomValidation|required" />

<!-- using `:alt=` alternate text as error message -->
<input type="text" class="form-control"
            name="input1"
            ng-model="vm.model.input1"
            validation="custom:vm.myCustomValidation:alt=Custom error message|required" />

<!-- You can combine that with other validators as well -->
<input type="text" class="form-control"
            name="input1"
            ng-model="vm.model.input1"
            validation="alpha|min_len:2|custom:vm.myCustomValidation|required" />

####Service Same thing but your validator rules are defined in the controller

// inject the validationService inside your Controller
myApp.controller('Ctrl', function ($scope, validationService) {
  // start by creating the service
  var vs = new validationService({ controllerAs: vms });

  vs.addValidator({
    elmName: 'input1',
    scope: $scope,
    rules: 'custom:myCustomValidation|required'
  });

  // or if you use the ControllerAs vm alias
  // rules: 'custom:vm.myCustomValidation|required'

  // or combine it with multiple validators
  vs.addValidator({
    elmName: 'input1',
    scope: $scope,
    rules: 'alpha|min_len:2|custom:myCustomValidation|required'
  });

  // or make it on a 1 line
  vs.addValidator('input1', 'alpha|min_len:2|custom:myCustomValidation|required');
});

For a complete test case example, you could also look at my code sample in my folder more-examples/customJavascript