Working Service Examples

Other Working Examples (Service)

P.S. For real live sample, see the live demo or download the Github project and run the index.html (on the exception of Chrome who doesn't want to run http outside of webserver) while the actual form with validation is inside templates/testingFormService.html for a better separation.

  // start by creating the service
  var myValidation = new validationService();

  // you can create indepent call to the validation service
  myValidation.addValidator({
    elmName: 'input2',
    // friendlyName: $translate.instant('FIRST_NAME'),
    debounce: 3000,
    scope: $scope,
    rules: 'numeric_signed|required'
  });

  // you can also chain validation service and add multiple validators at once
  // we optionally start by defining some global options. Note: each validator can overwrite individually these properties (ex.: validatorX can have a `debounce` different than the global set)
  // there is 2 ways to write a call... #1 with elementName & rules defined as 2 strings arguments ... #2 with 1 object as argument (with defined property names)
  //    #1 .addValidtor('myElementName', 'myRules') ... #2 .addValidator({ elmName: 'inputX', rules: 'myRules'})
  // the available object properties are the exact same set as the directive except that they are camelCase
  myValidation
    .setGlobalOptions({ debounce: 1500, scope: $scope })
    .addValidator('input3', 'float_signed|between_num:-0.6,99.5|required')
    .addValidator('input4', 'exact_len:4|regex:YYWW:=^(0[9]|1[0-9]|2[0-9]|3[0-9])(5[0-2]|[0-4][0-9])$:regex|required|integer')
    .addValidator('input5', 'email|required|min_len:6', $translate.instant('EMAIL')); // use 3rd argument for a friendlyName

  // you can also remove a Validator with an ngClick or whichever way you prefer by calling .removeValidator()
  $scope.removeInputValidator = function ( elmName ) {
    // 1st argument is the object holding our $validationSummary `$scope.yourFormName`
    //   If your form does not have a name attribute, your only choice is to use `$scope` as argument
    // 2nd argument, remove a single element (string)
    //    OR you can also remove multiple elements through an array type .removeValidator($scope.form1, ['input2','input3'])
    myValidation.removeValidator($scope.form1, elmName);
  };