File tree Expand file tree Collapse file tree 3 files changed +81
-2
lines changed
src/Umbraco.Web.UI.Client
common/directives/validation
views/propertyeditors/email
test/unit/common/directives Expand file tree Collapse file tree 3 files changed +81
-2
lines changed Original file line number Diff line number Diff line change
1
+ /**
2
+ * @ngdoc directive
3
+ * @name umbraco.directives.directive:valEmail
4
+ * @restrict A
5
+ * @description A custom directive to validate an email address string, this is required because angular's default validator is incorrect.
6
+ **/
7
+ function valEmail ( valEmailExpression ) {
8
+
9
+ return {
10
+ require : 'ngModel' ,
11
+ restrict : "A" ,
12
+ link : function ( scope , elm , attrs , ctrl ) {
13
+
14
+ var patternValidator = function ( viewValue ) {
15
+ //NOTE: we don't validate on empty values, use required validator for that
16
+ if ( ! viewValue || valEmailExpression . EMAIL_REGEXP . test ( viewValue ) ) {
17
+ // it is valid
18
+ ctrl . $setValidity ( 'valEmail' , true ) ;
19
+ //assign a message to the validator
20
+ ctrl . errorMsg = "" ;
21
+ return viewValue ;
22
+ }
23
+ else {
24
+ // it is invalid, return undefined (no model update)
25
+ ctrl . $setValidity ( 'valEmail' , false ) ;
26
+ //assign a message to the validator
27
+ ctrl . errorMsg = "Invalid email" ;
28
+ return undefined ;
29
+ }
30
+ } ;
31
+
32
+ ctrl . $formatters . push ( patternValidator ) ;
33
+ ctrl . $parsers . push ( patternValidator ) ;
34
+ }
35
+ } ;
36
+ }
37
+
38
+ angular . module ( 'umbraco.directives' )
39
+ . directive ( "valEmail" , valEmail )
40
+ . factory ( 'valEmailExpression' , function ( ) {
41
+ return {
42
+ EMAIL_REGEXP : / ^ [ a - z 0 - 9 ! # $ % & ' * + \/ = ? ^ _ ` { | } ~ . - ] + @ [ a - z 0 - 9 ] ( [ a - z 0 - 9 - ] * [ a - z 0 - 9 ] ) ? ( \. [ a - z 0 - 9 ] ( [ a - z 0 - 9 - ] * [ a - z 0 - 9 ] ) ? ) * $ / i
43
+ } ;
44
+ } ) ;
Original file line number Diff line number Diff line change 1
1
< div >
2
2
3
- < input type ="email " name ="textbox "
3
+ < input type ="text " name ="textbox "
4
4
ng-model ="model.value "
5
5
id ="{{model.alias}} "
6
6
class ="umb-editor umb-textstring textstring "
7
+ val-email
7
8
ng-required ="model.config.IsRequired || model.validation.mandatory "
8
9
val-server ="value " />
9
10
10
11
< span class ="help-inline " val-msg-for ="textbox " val-toggle-msg ="required "> Required</ span >
11
- < span class ="help-inline " val-msg-for ="textbox " val-toggle-msg ="email "> Invalid email</ span >
12
+ < span class ="help-inline " val-msg-for ="textbox " val-toggle-msg ="valEmail "> Invalid email</ span >
12
13
< span class ="help-inline " val-msg-for ="textbox " val-toggle-msg ="valServer "> </ span >
13
14
</ div >
Original file line number Diff line number Diff line change
1
+ describe ( 'valEmail directive tests' , function ( ) {
2
+
3
+ var valEmailExpression ;
4
+
5
+ beforeEach ( module ( 'umbraco' ) ) ;
6
+
7
+ beforeEach ( inject ( function ( $injector ) {
8
+ //TODO: I have no idea why this doesn't work!!?? it freakin should
9
+ //valEmailExpression = $injector.get('valEmailExpression');
10
+
11
+ //in the meantime, i've had to hard code the regex statement here
12
+ valEmailExpression = {
13
+ EMAIL_REGEXP : / ^ [ a - z 0 - 9 ! # $ % & ' * + \/ = ? ^ _ ` { | } ~ . - ] + @ [ a - z 0 - 9 ] ( [ a - z 0 - 9 - ] * [ a - z 0 - 9 ] ) ? ( \. [ a - z 0 - 9 ] ( [ a - z 0 - 9 - ] * [ a - z 0 - 9 ] ) ? ) * $ / i
14
+ } ;
15
+
16
+ } ) ) ;
17
+
18
+ describe ( 'EMAIL_REGEXP' , function ( ) {
19
+ /* global EMAIL_REGEXP: false */
20
+ it ( 'should validate email' , function ( ) {
21
+ expect ( valEmailExpression . EMAIL_REGEXP . test ( 'a@b.com' ) ) . toBe ( true ) ;
22
+ expect ( valEmailExpression . EMAIL_REGEXP . test ( 'a@b.museum' ) ) . toBe ( true ) ;
23
+ expect ( valEmailExpression . EMAIL_REGEXP . test ( 'a@B.c' ) ) . toBe ( true ) ;
24
+ expect ( valEmailExpression . EMAIL_REGEXP . test ( 'a@.b.c' ) ) . toBe ( false ) ;
25
+ expect ( valEmailExpression . EMAIL_REGEXP . test ( 'a@-b.c' ) ) . toBe ( false ) ;
26
+ expect ( valEmailExpression . EMAIL_REGEXP . test ( 'a@b-.c' ) ) . toBe ( false ) ;
27
+ expect ( valEmailExpression . EMAIL_REGEXP . test ( 'a@3b.c' ) ) . toBe ( true ) ;
28
+ expect ( valEmailExpression . EMAIL_REGEXP . test ( 'a@b' ) ) . toBe ( true ) ;
29
+ expect ( valEmailExpression . EMAIL_REGEXP . test ( 'abc@xyz.financial' ) ) . toBe ( true ) ;
30
+
31
+ } ) ;
32
+ } ) ;
33
+
34
+ } ) ;
You can’t perform that action at this time.
0 commit comments