Extract checkboxlist all/none JS to october.form.js

modules/backend/widgets/form/assets/js/october.form.js

@@ -13,6 +13,7 @@
         this.options = options || {};
 
         this.bindDependants()
+        this.bindCheckboxlist()
         this.toggleEmptyTabs()
     }
 
@@ -20,6 +21,28 @@
         refreshHandler: null
     }
 
+    /*
+     * Logic for checkboxlist
+     */
+    FormWidget.prototype.bindCheckboxlist = function() {
+
+        var checkAllBoxes = function($field, flag) {
+            $('input[type=checkbox]', $field)
+                .prop('checked', flag)
+                .first()
+                .trigger('change')
+        }
+
+        this.$el.on('click', '[data-field-checkboxlist-all]', function() {
+            checkAllBoxes($(this).closest('.field-checkboxlist'), true)
+        })
+
+        this.$el.on('click', '[data-field-checkboxlist-none]', function() {
+            checkAllBoxes($(this).closest('.field-checkboxlist'), false)
+        })
+
+    }
+
     /*
      * Bind dependant fields
      */

modules/backend/widgets/form/partials/_field_checkboxlist.htm

@@ -40,12 +40,12 @@
                 <!-- Quick selection -->
                 <small>
                     <?= e(trans('backend::lang.form.select')) ?>:
-                    <a href="javascript:;" onclick="jQuery('#<?= $field->getId('scrollable') ?> input[type=checkbox]').prop('checked', true).first().trigger('change')"><?= e(trans('backend::lang.form.select_all')) ?></a>,
-                    <a href="javascript:;" onclick="jQuery('#<?= $field->getId('scrollable') ?> input[type=checkbox]').prop('checked', false).first().trigger('change')"><?= e(trans('backend::lang.form.select_none')) ?></a>
+                    <a href="javascript:;" data-field-checkboxlist-all><?= e(trans('backend::lang.form.select_all')) ?></a>,
+                    <a href="javascript:;" data-field-checkboxlist-none><?= e(trans('backend::lang.form.select_none')) ?></a>
                 </small>
 
                 <!-- Scrollable Checkbox list -->
-                <div class="field-checkboxlist-scrollable" id="<?= $field->getId('scrollable') ?>">
+                <div class="field-checkboxlist-scrollable">
                     <div class="control-scrollbar" data-control="scrollbar">
             <?php endif ?>