AUI-2094 Remove feedback added by Form Validator when the field is no…

…t required and empty
liferay · Mar 11, 2016 · e8c1915 · e8c1915
1 parent 175d0eb
commit e8c1915
Show file tree

Hide file tree

Showing 3 changed files with 55 additions and 24 deletions.
diff --git a/src/aui-form-validator/HISTORY.md b/src/aui-form-validator/HISTORY.md
@@ -4,6 +4,7 @@
 
 ## @VERSION@
 
+* [AUI-2094](https://issues.liferay.com/browse/AUI-2094) Remove feedback added by Form Validator when the field is not required and empty
 * [AUI-2055](https://issues.liferay.com/browse/AUI-2055) aria-invalid attribute not removed from blank input fields
 * [AUI-2038](https://issues.liferay.com/browse/AUI-2038) UI should alert about non-unique value in structure field of type Select.
 * [AUI-2037](https://issues.liferay.com/browse/AUI-2037) validateField() does not reset error states for fields no longer in the DOM, preventing form submission

diff --git a/src/aui-form-validator/js/aui-form-validator.js b/src/aui-form-validator/js/aui-form-validator.js
@@ -809,19 +809,33 @@ var FormValidator = A.Component.create({
             var instance = this,
                 fieldContainer = instance.findFieldContainer(field);
 
-            instance._highlightHelper(
-                field,
-                instance.get('errorClass'),
-                instance.get('validClass'),
-                valid
-            );
-
-            instance._highlightHelper(
-                fieldContainer,
-                instance.get('containerErrorClass'),
-                instance.get('containerValidClass'),
-                valid
-            );
+            if (field) {
+                if (this.validatable(field)) {
+                    instance._highlightHelper(
+                        field,
+                        instance.get('errorClass'),
+                        instance.get('validClass'),
+                        valid
+                    );    
+
+                    if (fieldContainer) {
+                        instance._highlightHelper(
+                            fieldContainer,
+                            instance.get('containerErrorClass'),
+                            instance.get('containerValidClass'),
+                            valid
+                        );
+                    }
+                }
+                else if (!field.val()) {
+                    field.removeClass('errorClass');
+                    field.removeAttribute('aria-invalid');
+                    if (fieldContainer) {
+                        fieldContainer.removeClass('containerErrorClass');
+                        fieldContainer.removeAttribute('aria-invalid');
+                    }
+                }
+            }
         },
 
         /**
@@ -1191,20 +1205,18 @@ var FormValidator = A.Component.create({
          * @protected
          */
         _highlightHelper: function(field, errorClass, validClass, valid) {
-            if (field) {
-                if (valid) {
-                    field.removeClass(errorClass).addClass(validClass);
+            if (valid) {
+                field.removeClass(errorClass).addClass(validClass);
 
-                    if (validClass === CSS_SUCCESS_FIELD) {
-                        field.removeAttribute('aria-invalid');
-                    }
+                if (validClass === CSS_SUCCESS_FIELD) {
+                    field.removeAttribute('aria-invalid');
                 }
-                else {
-                    field.removeClass(validClass).addClass(errorClass);
+            }
+            else {
+                field.removeClass(validClass).addClass(errorClass);
 
-                    if (errorClass === CSS_ERROR_FIELD) {
-                        field.set('aria-invalid', true);
-                    }
+                if (errorClass === CSS_ERROR_FIELD) {
+                    field.set('aria-invalid', true);
                 }
             }
         },

diff --git a/src/aui-form-validator/tests/unit/js/tests.js b/src/aui-form-validator/tests/unit/js/tests.js
@@ -584,6 +584,24 @@ YUI.add('aui-form-validator-tests', function(Y) {
             Y.Assert.isFalse(input.hasAttribute('aria-invalid'), 'Empty input field should not have aria-invalid attribute');
         },
 
+        'shouldn\'t add success-field class in a field with no rules': function() {
+            var form = Y.Node.create(
+                    '<form><input name="yes" id="yes" type="text"></form>'),
+                input = form.one('input');
+
+            var formValidator = new Y.FormValidator({
+                boundingBox: form
+            });
+
+            formValidator.highlight(input, true);
+
+            Y.Assert.isFalse(input.hasClass('success-field'));
+
+            formValidator.unhighlight(input);
+
+            Y.Assert.isFalse(input.hasClass('success-field'));
+        },
+
         _assertValidatorNextLabel: function(input) {
             var inputNode,
                 textNode;