Fix disabled="false" as attribute to run validation

evaluate the disabled="false" attribute value in Angular-Validation so
that the validation kicks in when this value is set to "false". This was
problem found with the 3rd party library nya-bootstrap-select

Author: ghiscoding

bower.json

@@ -1,6 +1,6 @@
 {
   "name": "angular-validation-ghiscoding",
-  "version": "1.5.17",
+  "version": "1.5.18",
   "author": "Ghislain B.",
   "description": "Angular-Validation Directive and Service (ghiscoding)",
   "main": [

changelog.txt

@@ -1,5 +1,6 @@
 Angular-Validation change logs
 
+1.5.18 (2017-03-31) Fix disabled="false" as attribute to run validation.
 1.5.17 (2017-03-10) Add silent mode to checkFormValidity function
 1.5.16 (2017-01-24) Fix issue where empty Form Controller was throwing an error
 1.5.15 (2017-01-19) Rename errorMessageVisible flag to isErrorMessageVisible.

dist/angular-validation.min.js

@@ -50,16 +50,14 @@ <h1>Angular-Validation Directive|Service (ghiscoding)</h1>
 			<script src="vendors/angular-translate/angular-translate-loader-static-files.min.js"></script>
 
 			<!-- You can also load angular-validation with the all in 1 minified file -->
-		  	<script type="text/javascript" src="dist/angular-validation.min.js"></script>
+		  	<!--<script type="text/javascript" src="dist/angular-validation.min.js"></script>-->
 
 			<!-- angular-validation, directive and service are totally independent you can load one or the other or you can use them in parallel too. But `-common.js` and `-rules.js` are mandatory. -->
-			<!--
 			<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>
-			-->
-
+			
 			<!-- your ng-app file -->
 		  	<script type="text/javascript" src="app.js"></script>
 	  	</div>

index.html

@@ -53,7 +53,7 @@
     <!-- AngularJS Dropdown MultiSelect -->
     <script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.min.js"></script>
     <script type="text/javascript" src="https://rawgit.com/pc035860/angular-highlightjs/master/angular-highlightjs.js"></script>
-    <script src="https://rawgit.com/dotansimha/angularjs-dropdown-multiselect/master/src/angularjs-dropdown-multiselect.js"></script>
+    <script src="https://rawgit.com/dotansimha/angularjs-dropdown-multiselect/master/dist/angularjs-dropdown-multiselect.min.js"></script>
 
     <!-- AngularJS Multi-Select -->
     <script src="https://rawgit.com/isteven/angular-multi-select/master/isteven-multi-select.js"></script>

more-examples/addon-3rdParty-withScope/index.html

@@ -119,7 +119,7 @@ <h4><strong>ERRORS!</strong></h4>
     <!-- AngularJS Dropdown MultiSelect -->
     <script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.min.js"></script>
     <script type="text/javascript" src="https://rawgit.com/pc035860/angular-highlightjs/master/angular-highlightjs.js"></script>
-    <script src="https://rawgit.com/dotansimha/angularjs-dropdown-multiselect/master/src/angularjs-dropdown-multiselect.js"></script>
+    <script src="https://rawgit.com/dotansimha/angularjs-dropdown-multiselect/master/dist/angularjs-dropdown-multiselect.min.js"></script>
 
     <!-- AngularJS Multi-Select -->
     <script src="https://rawgit.com/isteven/angular-multi-select/master/isteven-multi-select.js"></script>

more-examples/addon-3rdParty/index.html

@@ -1,6 +1,6 @@
 {
   "name": "angular-validation-ghiscoding",
-  "version": "1.5.17",
+  "version": "1.5.18",
   "author": "Ghislain B.",
   "description": "Angular-Validation Directive and Service (ghiscoding)",
   "main": "dist/angular-validation.min",

package.json

@@ -153,10 +153,10 @@ angular
         // also save it inside controllerAs form (if found)
         if (!!form && !!form.$name) {
           var formName = form.$name.indexOf('.') >= 0 ? form.$name.split('.')[1] : form.$name;
-          var ctrlForm = (!!_globalOptions.controllerAs && !!_globalOptions.controllerAs[formName]) 
-			? _globalOptions.controllerAs[formName] 
+          var ctrlForm = (!!_globalOptions.controllerAs && !!_globalOptions.controllerAs[formName])
+			? _globalOptions.controllerAs[formName]
 			: ((typeof self.elm.controller() !== "undefined") ? self.elm.controller()[formName] : null);
-			
+
           if(!!ctrlForm) {
             ctrlForm.$validationSummary = arrayFindObjects(_validationSummary, 'formName', form.$name);
           }
@@ -542,9 +542,22 @@ angular
           validator = validatorAutoDetectType(validator, strValue);
         }
 
-        // get the ngDisabled attribute if found
+        // get the disabled & ngDisabled attributes if found
+        var elmAttrDisabled = self.elm.prop("disabled");
         var elmAttrNgDisabled = (!!self.attrs) ? self.attrs.ngDisabled : self.validatorAttrs.ngDisabled;
 
+        var isDisabled = (elmAttrDisabled === "")
+            ? true
+            : (typeof elmAttrDisabled === "boolean")
+              ? elmAttrDisabled
+              : (typeof elmAttrDisabled !== "undefined") ? self.scope.$eval(elmAttrDisabled) : false;
+
+        var isNgDisabled = (elmAttrNgDisabled === "")
+            ? true
+            : (typeof elmAttrNgDisabled === "boolean")
+              ? elmAttrNgDisabled
+              : (typeof elmAttrNgDisabled !== "undefined") ? self.scope.$eval(elmAttrNgDisabled) : false;
+
         // now that we have a Validator type, we can now validate our value
         // there is multiple type that can influence how the value will be validated
         switch(validator.type) {
@@ -569,7 +582,7 @@ angular
         }
 
         // not required and not filled is always valid & 'disabled', 'ng-disabled' elements should always be valid
-        if ((!self.bFieldRequired && !strValue && !_validateOnEmpty) || (!!self.elm.prop("disabled") || !!self.scope.$eval(elmAttrNgDisabled))) {
+        if ((!self.bFieldRequired && !strValue && !_validateOnEmpty) || (isDisabled || isNgDisabled)) {
           isConditionValid = true;
         }
 
@@ -1404,9 +1417,22 @@ angular
 
       // get the ngDisabled attribute if found
       var elmAttrNgDisabled = (!!self.attrs) ? self.attrs.ngDisabled : self.validatorAttrs.ngDisabled;
+      var elmAttrDisabled = self.elm.prop("disabled");
+
+      var isDisabled = (elmAttrDisabled === "")
+            ? true
+            : (typeof elmAttrDisabled === "boolean")
+              ? elmAttrDisabled
+              : (typeof elmAttrDisabled !== "undefined") ? self.scope.$eval(elmAttrDisabled) : false;
+
+      var isNgDisabled = (elmAttrNgDisabled === "")
+            ? true
+            : (typeof elmAttrNgDisabled === "boolean")
+              ? elmAttrNgDisabled
+              : (typeof elmAttrNgDisabled !== "undefined") ? self.scope.$eval(elmAttrNgDisabled) : false;
 
       // a 'disabled' element should always be valid, there is no need to validate it
-      if (!!self.elm.prop("disabled") || !!self.scope.$eval(elmAttrNgDisabled)) {
+      if (isDisabled || isNgDisabled) {
         isValid = true;
       } else {
         // before running Regex test, we'll make sure that an input of type="number" doesn't hold invalid keyboard chars, if true skip Regex

src/validation-common.js

@@ -48,7 +48,12 @@
         // watch the `disabled` attribute for changes
         // if it become disabled then skip validation else it becomes enable then we need to revalidate it
         attrs.$observe("disabled", function(disabled) {
-          if (disabled) {
+          var isDisabled = (disabled === "")
+            ? true
+            : (typeof disabled === "boolean") ? disabled
+              : (typeof disabled !== "undefined") ? scope.$eval(disabled) : false;
+
+          if (isDisabled === true) {
             // Turn off validation when element is disabled & remove it from validation summary
             cancelValidation();
             commonObj.removeFromValidationSummary(_elmName);

src/validation-directive.js

@@ -547,7 +547,12 @@ angular
         // use a timeout so that the digest of removing the `disabled` attribute on the DOM is completed
         // because commonObj.validate() checks for both the `disabled` and `ng-disabled` attribute so it basically fails without the $timeout because of the digest
         $timeout(function() {
-          if (disabled) {
+          var isDisabled = (disabled === "")
+            ? true
+            : (typeof disabled === "boolean") ? disabled
+              : (typeof disabled !== "undefined") ? scope.$eval(disabled) : false;
+
+          if (isDisabled) {
             // Remove it from validation summary
             attrs.ctrl.$setValidity('validation', true);
             self.commonObj.updateErrorMsg('', { isValid: true, obj: formElmObj });