-
Notifications
You must be signed in to change notification settings - Fork 58
Regular Expression Pattern
Since version 1.3.35
With Angular-Validation you can also use custom regular expression, there is no limitation on this validator itself and you can even use the pipe " | "
inside the regular expression without being scared of interfering with the other validation filters. The only thing required, is to prefix the validator with pattern=
and then add your regular expression pattern and at the end use :alt=
to provide an alternate text for showing the error message. There is also no need to escape anything, just use regular expression and you're good to go. So in short, it would look like this pattern=/.../:alt=Your error message
####Directive
<!-- let's define a quick pattern for testing date code (YYWW) -->
<input type="text" name="datecode"
validation="pattern=/^(0[9]|1[0-9]|2[0-9]|3[0-9])(5[0-2]|[0-4][0-9])$/:alt=Pattern must be YYWW" />
<!-- you can also mix it with other validators -->
<input type="text" name="datecode"
validation="alpha|exact_len:4|pattern=/^(0[9]|1[0-9]|2[0-9]|3[0-9])(5[0-2]|[0-4][0-9])$/:alt=Pattern must be YYWW|required" />
<!-- more complicated expression to get a first & last name -->
<input type="text" name="fullname"
validation="alpha_dash_spaces|pattern=/(\w+)\s(\w+)/:alt=Provide your full name|required" />
####Service
Same thing but your validator rules are defined in the controller
```javascript
// start by creating the service
var myValidation = new validationService();
// full definition
myValidation.addValidator({
elmName: 'datecode',
scope: $scope,
rules: 'pattern=/^(0[9]|1[0-9]|2[0-9]|3[0-9])(5[0-2]|[0-4][0-9])$/:alt=Pattern must be YYWW|required'
});
// or defined as 1 liner
myValidation
.addValidator('datecode', 'pattern=/^(0[9]|1[0-9]|2[0-9]|3[0-9])(5[0-2]|[0-4][0-9])$/:alt=Pattern must be YYWW|required');
.addValidator('fullname', 'pattern=/(\w+)\s(\w+)/:alt=Provide your full name|required');
#####Test your Regular Expression Pattern before adding it to Angular-Validation Make sure they work before adding them as a validation
// pattern accepting 2 words separated by a space (example a person full name)
var pattern = /(\w+)\s(\w+)/;
var result1 = pattern.test("John Smith"); // will return True
var result2 = pattern.test("JohnSmith"); // will return False
#####Add it as a validation Alright we tested it, let's use it
<input type="text" name="fullname"
validation="pattern=/(\w+)\s(\w+)/:alt=You must provide your full name|required" />
###Important Notice (on previous implementation)
######Deprecated
Previous (regex) implementation of regex: ... :regex
has been deprecated but it's still part of Angular-Validation, so don't be afraid it won't break your code even if you keep old implementation (both old and new works).
######Why?
The usage of it was different and was requiring to escape everything, provide an error message directly inside the validator and was not close enough to regular expression to my taste. Since I also created the :alt=
(alternate text) later, it also make sense to use it so it follows a more concise standard.
######Suggestion
So I strongly suggest you to update your code and use the new pattern=
validator, you will gain in term of how easy it is to add custom regular expression... but don't being afraid, your code still works with the old implementation. It's just a suggestion ;)
Contents
- Angular-Validation Wiki
- Installation
- Demo
- Code Samples
- Functionalities
- Custom Validations
- Properties & Options
- Validators
- Tests
- Misc