From 22f6e78754f61cdc8cc560ed5960861fa2d3d155 Mon Sep 17 00:00:00 2001
From: JSlain <nadeau.ghislain@gmail.com>
Date: Sun, 19 Feb 2017 12:54:40 -0500
Subject: [PATCH] Issue #111: Adjusted the demo to use angular-messages

---
 bower.json      |  4 ++--
 demo/app.js     |  2 +-
 demo/index.html | 23 ++++++++++++-----------
 3 files changed, 15 insertions(+), 14 deletions(-)

diff --git a/bower.json b/bower.json
index f644c14..ce2d7bf 100644
--- a/bower.json
+++ b/bower.json
@@ -32,10 +32,10 @@
   "dependencies": {
     "angular": ">=1.3.0",
     "jquery": "~2.1.4"
-
   },
   "devDependencies": {
-    "angular-mocks": "~1.4.1"
+    "angular-mocks": "~1.4.1",
+    "angular-messages": "^1.6.2"
   },
   "homepage": "https://github.com/turinggroup/angular-validator"
 }
diff --git a/demo/app.js b/demo/app.js
index 5f78e45..e83355e 100644
--- a/demo/app.js
+++ b/demo/app.js
@@ -1,4 +1,4 @@
-angular.module('angular-validator-demo', ['angularValidator']);
+angular.module('angular-validator-demo', ['angularValidator', 'ngMessages']);
 
 
 angular.module('angular-validator-demo').controller('DemoCtrl', function($scope) {
diff --git a/demo/index.html b/demo/index.html
index dad5d8f..e14d181 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -178,7 +178,7 @@ <h4>Field invalid message hides form invalid message</h4>
         </form>
 
         <form angular-validator-submit="submitMyForm()" name="myForm3" class="form-horizontal" novalidate angular-validator >
-            <h4>Using Field angular-validator-quiet</h4>
+            <h4>Using Field angular-validator-quiet (with angular-messages)</h4>
             <div class="form-group">
                 <label class="col-sm-2 control-label">Field 1 max length 5</label>
                 <div class="col-sm-10">
@@ -189,9 +189,9 @@ <h4>Using Field angular-validator-quiet</h4>
                             ng-maxlength="5"
                             required
                             angular-validator-quiet></div>
-                <div class="col-sm-12" ng-if="myForm3.submitted" ng-cloak="">
-                    <div class="alert alert-danger" ng-if="myForm3.form3input.$error.required">"Required" message with manual template</div>
-                    <div class="alert alert-danger" ng-if="myForm3.form3input.$error.maxlength">"Max Length" message with manual template</div>
+                <div class="col-sm-12" ng-messages="myForm3.form3input.$error" ng-if="myForm3.submitted" ng-cloak="">
+                    <div class="alert alert-danger" ng-message="required">"Required" message with manual template</div>
+                    <div class="alert alert-danger" ng-message="maxlength">"Max Length" message with manual template</div>
                 </div>
             </div>
             <div class="form-group">
@@ -215,7 +215,7 @@ <h4>Using Field angular-validator-quiet</h4>
         </form>
 
         <form angular-validator-submit="submitMyForm()" name="myForm4" class="form-horizontal" novalidate angular-validator angular-validator-quiet>
-            <h4>Using Form angular-validator-quiet</h4>
+            <h4>Using Form angular-validator-quiet (with angular-messages)</h4>
             <div class="form-group">
                 <label class="col-sm-2 control-label">Field 1 max length 5</label>
                 <div class="col-sm-10">
@@ -225,9 +225,9 @@ <h4>Using Form angular-validator-quiet</h4>
                             ng-model="form4input"
                             ng-maxlength="5"
                             required></div>
-                <div class="col-sm-12" ng-if="myForm4.submitted" ng-cloak="">
-                    <div class="alert alert-danger" ng-if="myForm4.form4input.$error.required">"Required" message with manual template</div>
-                    <div class="alert alert-danger" ng-if="myForm4.form4input.$error.maxlength">"Max Length" message with manual template</div>
+                <div class="col-sm-12" ng-if="myForm4.submitted" ng-messages="myForm4.form4input.$error" ng-cloak="">
+                    <div class="alert alert-danger" ng-message="required">"Required" message with manual template</div>
+                    <div class="alert alert-danger" ng-message="maxlength">"Max Length" message with manual template</div>
                 </div>
             </div>
             <div class="form-group">
@@ -239,9 +239,9 @@ <h4>Using Form angular-validator-quiet</h4>
                             ng-model="form4input2"
                             ng-maxlength="5"
                             required></div>
-                <div class="col-sm-12" ng-if="myForm4.submitted" ng-cloak="">
-                    <div class="alert alert-danger" ng-if="myForm4.form4input2.$error.required">"Required" message with manual template</div>
-                    <div class="alert alert-danger" ng-if="myForm4.form4input2.$error.maxlength">"Max Length" message with manual template</div>
+                <div class="col-sm-12" ng-if="myForm4.submitted" ng-messages="myForm4.form4input2.$error" ng-cloak="">
+                    <div class="alert alert-danger" ng-message="required">"Required" message with manual template</div>
+                    <div class="alert alert-danger" ng-message="maxlength">"Max Length" message with manual template</div>
                 </div>
             </div>
             <hr>
@@ -267,6 +267,7 @@ <h4> <u>Scope Sneak Peak</u>
     </div>
     <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js"></script>
     <script src="app.js"></script>
+    <script src="/bower_components/angular-messages/angular-messages.js"></script>
     <script src="../dist/angular-validator.js"></script>
 
 </body>