Fix issue #76 - problem with ui-mask

ghiscoding · ghiscoding · commit 54cc7e15fe32 · 2015-10-25T20:45:55.000-04:00
diff --git a/more-examples/ui-mask/app.js b/more-examples/ui-mask/app.js
@@ -0,0 +1,29 @@
+'use strict';
+
+var myApp = angular.module('myApp', ['ghiscoding.validation', 'pascalprecht.translate', 'ui.mask']);
+
+myApp.config(['$compileProvider', function ($compileProvider) {
+    $compileProvider.debugInfoEnabled(false);
+  }])
+	.config(['$translateProvider', function ($translateProvider) {
+	  $translateProvider.useStaticFilesLoader({
+      prefix: '../../locales/validation/',
+      suffix: '.json'
+    });
+  	// load English ('en') table on startup
+		$translateProvider.preferredLanguage('en').fallbackLanguage('en');
+	}]);
+
+myApp.controller('Ctrl',
+['$scope', '$translate', 'validationService', '$timeout',
+function ($scope, $translate, validationService, $timeout) {
+  var vm = this;
+  vm.model = {};
+
+  function next(form) {
+     var vs = new validationService();
+     if (vs.checkFormValidity(form)) {
+        // proceed to another view
+     };
+  }
+}]);
diff --git a/more-examples/ui-mask/index.html b/more-examples/ui-mask/index.html
@@ -0,0 +1,56 @@
+<!DOCTYPE html>
+<html ng-app="myApp" ng-strict-di ng-cloak="">
+  <head>
+    <meta charset="utf-8" />
+    <title>Angular-Validation Example with Interpolation</title>
+    <link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
+    <link rel="stylesheet" href="../../style.css">
+  </head>
+
+  <body ng-controller="Ctrl as vm">
+    <div class="container">
+      <h2>ui-mask and wizard</h2>
+
+      <form novalidate name="formSsn">
+          <input type="text" name="social-number" ng-model="wizard.userInfo.ssn" class="input" ui-mask="999-99-9999" ui-options="{clearOnBlur:false}" placeholder="###-##-####" ui-mask-placeholder  validation="required:alt=Social security number is required." autofocus>
+      </form>
+      <a ng-click="next(formSsn)">Next</a>
+
+      <br/>
+      <br/>
+      <div class="alert alert-danger alert-dismissable" ng-show="vm.test.$validationSummary.length &gt; 0">
+        <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+        <h4><strong>ERRORS!</strong></h4>
+        <ul>
+            <li ng-repeat="item in vm.test.$validationSummary">{{ item.field }}: {{item.message}}</li>
+        </ul>
+      </div>
+
+      <ng-view></ng-view>
+    </div>
+
+    <!-- external librairies CDN -->
+    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.js"></script>
+    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular-route.js"></script>
+
+    <!-- angular-translate -->
+    <!-- Visit Angular-Translate https://github.com/PascalPrecht/angular-translate -->
+    <script src="../../vendors/angular-translate/angular-translate.min.js"></script>
+    <script src="../../vendors/angular-translate/angular-translate-loader-static-files.min.js"></script>
+
+    <!-- Angular-UI -->
+    <script src="https://raw.githubusercontent.com/angular-ui/ui-mask/master/dist/mask.min.js"></script>
+
+    <!-- Angular-Validation -->
+    <!--<script type="text/javascript" src="../../dist/angular-validation.min.js"></script>-->
+    
+    <script type="text/javascript" src="../../src/validation-directive.js"></script>
+    <script type="text/javascript" src="../../src/validation-service.js"></script>
+    <script type="text/javascript" src="../../src/validation-common.js"></script>
+    <script type="text/javascript" src="../../src/validation-rules.js"></script>
+    
+
+    <!-- my application -->
+    <script type="text/javascript" src="app.js"></script>
+  </body>
+</html>
