Alternate Text on Validators

Alternate Text on Validators

Validators can now use alternate text instead of the usual defined locale $translate text, for example seeing "Field is Required" on a <select> might not always be useful, it might be more useful to see an alternate text that is "Please choose an option". Alternate text works on all type of validators and is defined by adding :alt= at the end of any validators, it could be used on 1 or more validators directly inside the validation="" attribute. See the examples below.

<!-- You can use translate in your HTML -->
<!-- Example #1 with 1 alternate text on 1 of the 2 validators -->
<input name="input1" validation="alpha|required:alt=Your Alternate Required Text." />

<!-- Example #2, alternate text on multiple validators -->
<input name="input1" validation="date_iso_between:2015-03-01,2015-03-30:alt=Booking date must be in April|required:alt=Booking Date is Required" />

<!-- Example #3, use $translate as alternate text -->
<input name="input1" validation="min_len:5|required:alt={{ 'YOUR_TEXT' | translate }}" />

// When using the Validation Service

myApp.controller('CtrlValidationService', function ($scope, $translate, validationService) {
  // Example #1 with 1 alternate text on 1 of the 2 validators
  myValidationService.addValidator('input1', 'alpha|required:alt=Your Alternate Required Text.');

  // Example #2, alternate text on multiple validators
  myValidationService.addValidator('input1', 'date_iso_between:2015-03-01,2015-03-30:alt=Booking date must be in April|required:alt=Booking Date is Required');

  // Example #3, use $translate as alternate text
  // you can use the $translate.instant() function
  myValidationService.addValidator('input1', 'min_len:5|required:alt=' + $translate.instant('YOUR_TEXT'))
});