Skip to content
This repository was archived by the owner on Jul 1, 2020. It is now read-only.

Commit 743db27

Browse files
committed
Fixed issue #52 (interpolation), issue #52 ( ngIf )
- Fixed issue #52, Changed default behavior of `ngDisabled` which was displaying error message right after an element became enabled, it will still pre-validate but not directly show the error message unless `preValidateFormElements` is set to True. - Look into the folder /more-examples/interpolate/ - Fixed issue #53, To support `ngIf` (add a trigger on element `$destroy`). - Look into the folder /more-examples/ngIfShowHideDisabled/
1 parent 6293025 commit 743db27

File tree

15 files changed

+441
-92
lines changed

15 files changed

+441
-92
lines changed

bower.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "angular-validation-ghiscoding",
3-
"version": "1.3.37",
3+
"version": "1.3.38",
44
"author": "Ghislain B.",
55
"description": "Angular-Validation Directive and Service (ghiscoding)",
66
"main": [

changelog.txt

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
Angular-Validation change logs
22

3-
1.3.37 (2015-07-21) Fixed a small IE8 problem.
3+
1.3.38 (2015-07-28) Fixed issue #52 - Changed default behavior of `ngDisabled` which was displaying error message right after an element became enabled, it will still pre-validate but not directly show the error message unless `preValidateFormElements` is set to True. Fixed issue #53 - To support `ngIf` (add a trigger on element `$destroy`).
4+
1.3.37 (2015-07-21) Fixed a small IE8 problem with "catch" being a reserved word.
45
1.3.36 (2015-07-20) Enhancement #47 - New option to use the ControllerAs syntax. Also fixed issue #48.
56
1.3.35 (2015-07-15) Deprecated old implentation of `regex:...:regex` (though it still works) by a new and much better implementation of `pattern=` validator. Converted all the rules from string pattern to regex pattern (when possible) defined in `angular-validation.js`. Also fixed issue #45 on email check.
67
1.3.34 (2015-07-08) Merge pull request #44 - Adding support to brazilian portuguese language.

dist/angular-validation.min.js

Lines changed: 4 additions & 4 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

more-examples/dynamic-form/index.html

Lines changed: 19 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -39,26 +39,27 @@ <h4>Forms are Valid after Submit</h4>
3939
<span><label>Form2 isValid:</label> {{ Form2.isValid }} </span>
4040
</div>
4141
</div>
42-
<!-- external librairies CDN -->
43-
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.js"></script>
44-
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-route.js"></script>
45-
<script type="text/javascript" src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.12.1.js"></script>
4642

47-
<!-- angular-translate -->
48-
<!-- Visit Angular-Translate https://github.com/PascalPrecht/angular-translate -->
49-
<script src="../../vendors/angular-translate/angular-translate.min.js"></script>
50-
<script src="../../vendors/angular-translate/angular-translate-loader-static-files.min.js"></script>
43+
<!-- external librairies CDN -->
44+
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.js"></script>
45+
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-route.js"></script>
46+
<script type="text/javascript" src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.12.1.js"></script>
5147

52-
<!-- Angular-Validation -->
53-
<script type="text/javascript" src="../../dist/angular-validation.min.js"></script>
54-
<!--
55-
<script type="text/javascript" src="../../src/validation-directive.js"></script>
56-
<script type="text/javascript" src="../../src/validation-service.js"></script>
57-
<script type="text/javascript" src="../../src/validation-common.js"></script>
58-
<script type="text/javascript" src="../../src/validation-rules.js"></script>
59-
-->
48+
<!-- angular-translate -->
49+
<!-- Visit Angular-Translate https://github.com/PascalPrecht/angular-translate -->
50+
<script src="../../vendors/angular-translate/angular-translate.min.js"></script>
51+
<script src="../../vendors/angular-translate/angular-translate-loader-static-files.min.js"></script>
6052

61-
<script src="app.js"></script>
62-
</body>
53+
<!-- Angular-Validation -->
54+
<script type="text/javascript" src="../../dist/angular-validation.min.js"></script>
55+
<!--
56+
<script type="text/javascript" src="../../src/validation-directive.js"></script>
57+
<script type="text/javascript" src="../../src/validation-service.js"></script>
58+
<script type="text/javascript" src="../../src/validation-common.js"></script>
59+
<script type="text/javascript" src="../../src/validation-rules.js"></script>
60+
-->
61+
62+
<script src="app.js"></script>
6363

64+
</body>
6465
</html>

more-examples/dynamic-input/index.html

Lines changed: 21 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -20,26 +20,27 @@ <h3 class="text-info">{{'CHANGE_LANGUAGE' | translate}}</h3>
2020
<br/><hr/>
2121

2222
<ng-view></ng-view>
23-
24-
<!-- external librairies CDN -->
25-
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.js"></script>
26-
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-route.js"></script>
27-
28-
<!-- angular-translate -->
29-
<!-- Visit Angular-Translate https://github.com/PascalPrecht/angular-translate -->
30-
<script src="../../vendors/angular-translate/angular-translate.min.js"></script>
31-
<script src="../../vendors/angular-translate/angular-translate-loader-static-files.min.js"></script>
32-
33-
<!-- Angular-Validation -->
34-
<script type="text/javascript" src="../../dist/angular-validation.min.js"></script>
35-
36-
<!--<script type="text/javascript" src="../../src/validation-directive.js"></script>
37-
<script type="text/javascript" src="../../src/validation-service.js"></script>
38-
<script type="text/javascript" src="../../src/validation-common.js"></script>
39-
<script type="text/javascript" src="../../src/validation-rules.js"></script>-->
40-
41-
<!-- my application -->
42-
<script type="text/javascript" src="app.js"></script>
4323
</div>
24+
25+
<!-- external librairies CDN -->
26+
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.js"></script>
27+
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-route.js"></script>
28+
29+
<!-- angular-translate -->
30+
<!-- Visit Angular-Translate https://github.com/PascalPrecht/angular-translate -->
31+
<script src="../../vendors/angular-translate/angular-translate.min.js"></script>
32+
<script src="../../vendors/angular-translate/angular-translate-loader-static-files.min.js"></script>
33+
34+
<!-- Angular-Validation -->
35+
<script type="text/javascript" src="../../dist/angular-validation.min.js"></script>
36+
<!--
37+
<script type="text/javascript" src="../../src/validation-directive.js"></script>
38+
<script type="text/javascript" src="../../src/validation-service.js"></script>
39+
<script type="text/javascript" src="../../src/validation-common.js"></script>
40+
<script type="text/javascript" src="../../src/validation-rules.js"></script>
41+
-->
42+
43+
<!-- my application -->
44+
<script type="text/javascript" src="app.js"></script>
4445
</body>
4546
</html>
Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
'use strict';
2+
3+
var myApp = angular.module('myApp', ['ghiscoding.validation', 'pascalprecht.translate']);
4+
5+
myApp.config(['$compileProvider', function ($compileProvider) {
6+
$compileProvider.debugInfoEnabled(false);
7+
}])
8+
.config(['$translateProvider', function ($translateProvider) {
9+
$translateProvider.useStaticFilesLoader({
10+
prefix: '../../locales/validation/',
11+
suffix: '.json'
12+
});
13+
// load English ('en') table on startup
14+
$translateProvider.preferredLanguage('en').fallbackLanguage('en');
15+
}]);
16+
17+
myApp.controller('Ctrl',
18+
['$scope', '$translate', 'validationService',
19+
function ($scope, $translate, validationService) {
20+
var vm = this;
21+
vm.model = {};
22+
vm.validationRequired = true;
23+
var validation = new validationService({ controllerAs: vm, preValidateFormElements: true });
24+
25+
vm.f1Validation = function () {
26+
return vm.validationRequired ? 'required' : '';
27+
}
28+
29+
vm.if1Validation = function () {
30+
return vm.validationRequired ? '' : 'required';
31+
}
32+
33+
vm.checkboxChange = function() {
34+
//console.log('vm.f1Validation()', '['+vm.f1Validation()+']');
35+
//console.log('vm.if1Validation()', '['+vm.if1Validation()+']');
36+
validation.checkFormValidity(vm.test); // force validation
37+
}
38+
}]);
Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
<!DOCTYPE html>
2+
<html ng-app="myApp" ng-strict-di ng-cloak="">
3+
<head>
4+
<meta charset="utf-8" />
5+
<title>Angular-Validation Example with Interpolation</title>
6+
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
7+
<link rel="stylesheet" href="../../style.css">
8+
</head>
9+
10+
<body ng-controller="Ctrl as vm">
11+
<div class="container">
12+
<h2>Example of Angular-Validation interpolation to validation attribute.</h2>
13+
<hr/>
14+
15+
<div class="alert alert-danger alert-dismissable" ng-show="vm.test.$validationSummary.length &gt; 0">
16+
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
17+
<h4><strong>ERRORS!</strong></h4>
18+
<ul>
19+
<li ng-repeat="item in vm.test.$validationSummary">{{ item.friendlyName != '' ? item.friendlyName : item.field }}: {{item.message}}</li>
20+
</ul>
21+
</div>
22+
23+
<form name="vm.test">
24+
<br/>
25+
<label class="col-xs-4 control-label">Field1</label>
26+
<div class="col-xs-6">
27+
<input id="f1" class="form-control" type="text" name="f1"
28+
ng-model="vm.model.f1"
29+
validation="{{vm.f1Validation()}}" />
30+
</div>
31+
<br/>
32+
<label class="col-xs-4 control-label">Inverted Validation Field1</label>
33+
<div class="col-xs-6">
34+
<input id="if1" class="form-control" type="text" name="if1"
35+
ng-model="vm.model.if1"
36+
validation="{{vm.if1Validation()}}" />
37+
</div>
38+
<br/>
39+
<label class="col-xs-4 control-label">Toggle Validation</label>
40+
<div class="col-xs-6 text-left">
41+
<input id="toggle" type="checkbox" name="toggle"
42+
ng-model="vm.validationRequired"
43+
ng-change="vm.checkboxChange()" />
44+
</div>
45+
46+
<hr/>
47+
48+
<div class="col-xs-6">
49+
vm.validationRequired [{{vm.validationRequired}}]<br/>
50+
vm.f1Validation() [{{vm.f1Validation()}}]<br/>
51+
vm.if1Validation() [{{vm.if1Validation()}}]<br/>
52+
</div>
53+
</form>
54+
55+
<ng-view></ng-view>
56+
</div>
57+
58+
<!-- external librairies CDN -->
59+
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.js"></script>
60+
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-route.js"></script>
61+
62+
<!-- angular-translate -->
63+
<!-- Visit Angular-Translate https://github.com/PascalPrecht/angular-translate -->
64+
<script src="../../vendors/angular-translate/angular-translate.min.js"></script>
65+
<script src="../../vendors/angular-translate/angular-translate-loader-static-files.min.js"></script>
66+
67+
<!-- Angular-Validation -->
68+
<script type="text/javascript" src="../../dist/angular-validation.min.js"></script>
69+
<!--
70+
<script type="text/javascript" src="../../src/validation-directive.js"></script>
71+
<script type="text/javascript" src="../../src/validation-service.js"></script>
72+
<script type="text/javascript" src="../../src/validation-common.js"></script>
73+
<script type="text/javascript" src="../../src/validation-rules.js"></script>
74+
-->
75+
76+
<!-- my application -->
77+
<script type="text/javascript" src="app.js"></script>
78+
</body>
79+
</html>
Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
var myApp = angular.module('myApp', ['ghiscoding.validation', 'pascalprecht.translate']);
2+
3+
myApp.config(['$compileProvider', function($compileProvider) {
4+
$compileProvider.debugInfoEnabled(false);
5+
}]);
6+
myApp.config(['$translateProvider', function ($translateProvider) {
7+
$translateProvider.useStaticFilesLoader({
8+
prefix: '../../locales/validation/',
9+
suffix: '.json'
10+
});
11+
12+
// load English ('en') table on startup
13+
$translateProvider.preferredLanguage('en').fallbackLanguage('en');
14+
}]);
15+
16+
myApp.controller('Ctrl', ['$scope', 'validationService',
17+
function($scope, validationService) {
18+
19+
var validate = new validationService({ debounce: 100, isolatedScope: $scope});
20+
21+
$scope.ModelData = {};
22+
$scope.ModelData.IsShowNote = false;
23+
$scope.ModelData.Count = '';
24+
25+
$scope.ModelData.SaveFunctionClick = function() {
26+
if (validate.checkFormValidity($scope.f1)) {
27+
$scope.ModelData.Count = 'Form OK';
28+
}else {
29+
$scope.ModelData.Count = $scope.f1.$validationSummary.length;
30+
return;
31+
}
32+
}
33+
}
34+
]);
Lines changed: 117 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,117 @@
1+
<!DOCTYPE html>
2+
<html>
3+
4+
<head>
5+
<meta charset="utf-8" />
6+
<title>Angular-Validation Example with ngShow/ngHide/ngDisabled</title>
7+
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
8+
<link rel="stylesheet" href="../../style.css">
9+
</head>
10+
11+
<body ng-app="myApp">
12+
<div class="container" ng-controller="Ctrl">
13+
<h2>Example of Angular-Validation with "ngIf / ngShow / ngDisabled".</h2>
14+
<hr/>
15+
16+
<div class="alert alert-danger alert-dismissable" ng-show="f1.$validationSummary.length > 0">
17+
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
18+
<h4><strong>ERRORS!</strong></h4>
19+
<ul>
20+
<li ng-repeat="item in f1.$validationSummary">{{ item.friendlyName != '' ? item.friendlyName : item.field }}: {{item.message}}</li>
21+
</ul>
22+
</div>
23+
24+
<form class="col-xs-12" role="form" name='f1'>
25+
<div class="form-group">
26+
<div class="row">
27+
<label class="col-xs-4 control-label">AreaCode</label>
28+
<div class="col-xs-6">
29+
<input type="text" class="form-control" placeholder="Area code" ng-disabled="false" ng-model="ModelData.AreaCode"
30+
name="ModelData_AreaCode" validation="required|alpha_dash|min_len:2|max_len:20" />
31+
</div>
32+
</div>
33+
<div class="row">
34+
<label class="col-xs-4 control-label">AreaName</label>
35+
<div class="col-xs-6">
36+
<input type="text" class="form-control" placeholder="Area name" ng-model="ModelData.AreaName" name="ModelData_AreaName" validation="required|max_len:100" />
37+
</div>
38+
</div>
39+
40+
<div class="row">
41+
<label class="col-xs-4 control-label">Note</label>
42+
<div class="col-xs-6">
43+
<input type='text' class="form-control" ng-disabled="!ModelData.IsShowNote"
44+
ng-model="ModelData.Note" name="ModelData_Note" validation="required" />
45+
</div>
46+
</div>
47+
48+
<div class="row" ng-if="ModelData.IsShowNote">
49+
<label class="col-xs-4 control-label">Note 1</label>
50+
<div class="col-xs-6">
51+
<textarea class="form-control" ng-model="ModelData.Note1" name="ModelData_Note1" validation="required"></textarea>
52+
</div>
53+
</div>
54+
55+
<div class="row" ng-show="ModelData.IsShowNote">
56+
<label class="col-xs-4 control-label">Note 2</label>
57+
<div class="col-xs-6">
58+
<textarea class="form-control" ng-model="ModelData.Note2" name="ModelData_Note2" ng-disabled="!ModelData.IsShowNote" validation="required"></textarea>
59+
</div>
60+
</div>
61+
62+
<div class="row">
63+
<label class="col-xs-4 control-label">Show/Enable Note</label>
64+
<div class="col-xs-6">
65+
<input type="checkbox" ng-model="ModelData.IsShowNote" />
66+
</div>
67+
</div>
68+
<div class="row">
69+
<div class="col-xs-4 col-xs-offset-4">
70+
<button class="btn btn-primary" ng-click="ModelData.SaveFunctionClick()">
71+
Save(validate only)
72+
</button>
73+
</div>
74+
</div>
75+
<br/>
76+
<div class="row">
77+
<label class="col-xs-4 control-label">Validate count</label>
78+
<div class="col-xs-6">
79+
<label class="col-xs-2 control-label">{{ModelData.Count}}</label>
80+
<span><em>(click on button "Save" to refresh)</em></span>
81+
</div>
82+
</div>
83+
<div class="row">
84+
<label class="col-xs-4 control-label">Invalid fields</label>
85+
<div class="col-xs-8">
86+
<label class="col-xs-12 control-label">
87+
<span ng-repeat="item in f1.$validationSummary">{{item.field }}, </span>
88+
</label>
89+
</div>
90+
</div>
91+
</div>
92+
</form>
93+
</div>
94+
95+
<!-- external librairies CDN -->
96+
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.js"></script>
97+
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-route.js"></script>
98+
99+
<!-- angular-translate -->
100+
<!-- Visit Angular-Translate https://github.com/PascalPrecht/angular-translate -->
101+
<script src="../../vendors/angular-translate/angular-translate.min.js"></script>
102+
<script src="../../vendors/angular-translate/angular-translate-loader-static-files.min.js"></script>
103+
104+
<!-- Angular-Validation -->
105+
<script type="text/javascript" src="../../dist/angular-validation.min.js"></script>
106+
<!--
107+
<script type="text/javascript" src="../../src/validation-directive.js"></script>
108+
<script type="text/javascript" src="../../src/validation-service.js"></script>
109+
<script type="text/javascript" src="../../src/validation-common.js"></script>
110+
<script type="text/javascript" src="../../src/validation-rules.js"></script>
111+
-->
112+
113+
<!-- my application -->
114+
<script type="text/javascript" src="app.js"></script>
115+
</body>
116+
117+
</html>

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "angular-validation-ghiscoding",
3-
"version": "1.3.37",
3+
"version": "1.3.38",
44
"author": "Ghislain B.",
55
"description": "Angular-Validation Directive and Service (ghiscoding)",
66
"main": "app.js",

0 commit comments

Comments
 (0)