Make checkbox valid when at least one checkbox is checked (#490)

kevinchappell · May 24, 2017 · 4fa1233 · 4fa1233
1 parent a5ae640
commit 4fa1233
Show file tree

Hide file tree

Showing 9 changed files with 14 additions and 11 deletions.
diff --git a/demo/assets/js/form-builder.min.js b/demo/assets/js/form-builder.min.js
diff --git a/demo/assets/js/form-builder.min.js.gz b/demo/assets/js/form-builder.min.js.gz
diff --git a/demo/assets/js/form-render.min.js b/demo/assets/js/form-render.min.js
diff --git a/demo/assets/js/form-render.min.js.gz b/demo/assets/js/form-render.min.js.gz
diff --git a/dist/form-builder.min.js b/dist/form-builder.min.js
diff --git a/dist/form-builder.min.js.gz b/dist/form-builder.min.js.gz
diff --git a/dist/form-render.min.js b/dist/form-render.min.js
diff --git a/dist/form-render.min.js.gz b/dist/form-render.min.js.gz
diff --git a/src/js/control/select.js b/src/js/control/select.js
@@ -149,9 +149,9 @@ export default class controlSelect extends control {
    */
   groupRequired() {
     const checkboxes = this.element.getElementsByTagName('input');
-    let minReq = control.mi18n('minSelectionRequired', 1);
     const setValidity = (checkbox, isValid) => {
       if (!isValid) {
+        let minReq = control.mi18n('minSelectionRequired', 1);
         checkbox.setCustomValidity(minReq);
       } else {
         checkbox.setCustomValidity('');
@@ -168,12 +168,15 @@ export default class controlSelect extends control {
       });
     };
 
-    this.element.addEventListener('click', evt => {
-      if (evt.target.type === 'checkbox') {
-        let isValid = [].some.call(checkboxes, cb => cb.checked);
-        toggleRequired(checkboxes, isValid);
-      }
-    });
+    const toggleValid = () => {
+      let isValid = [].some.call(checkboxes, cb => cb.checked);
+      toggleRequired(checkboxes, isValid);
+    };
+
+    for (let i = checkboxes.length - 1; i >= 0; i--) {
+      checkboxes[i].addEventListener('change', toggleValid);
+    }
+    toggleValid();
   }
 
   /**