chg: [genericElements] Perform ajax call when filtering with context

templates/element/genericElements/IndexTable/Fields/toggle.php

@@ -82,7 +82,7 @@
     function submitForm(api, url) {
         return api.fetchAndPostForm(url, {})
             .then(() => {
-                reloadElement('/meta-templates', $('#table-container-<?= $tableRandomValue ?>'), $('#table-container-<?= $tableRandomValue ?> table.table'))
+                UI.reload('/meta-templates', $('#table-container-<?= $tableRandomValue ?>'), $('#table-container-<?= $tableRandomValue ?> table.table'))
             })
     }
 }())

templates/element/genericElements/ListTopBar/element_simple.php

@@ -1,12 +1,10 @@
 <?php
     if (!isset($data['requirement']) || $data['requirement']) {
-        $onClickActive = false;
         if (!empty($data['popover_url'])) {
             $onClick = sprintf(
                 'onClick="populateAndLoadModal(%s)"',
                 sprintf("'%s'", h($data['popover_url']))
             );
-            $onClickActive = true;
         }
         if (empty($onClick)) {
             if (!empty($data['onClick']) || empty($data['url'])) {
@@ -30,7 +28,6 @@
                         $onClickParams
                     ) : '')
                 );
-                $onClickActive = true;
             } else if(!empty($data['url'])) {
                 $onClick = sprintf(
                     'onClick = "%s"',
@@ -52,7 +49,7 @@
         echo sprintf(
             '<button class="btn btn-sm %s %s" %s href="%s" %s %s %s %s %s>%s%s%s</button>',
             empty($data['class']) ? '' : h($data['class']),
-            $onClickActive ? 'btn-primary' : (empty($data['active']) ? 'btn-light' : 'btn-secondary'),   // Change the default class for highlighted/active toggles here
+            !$data['isFilter'] ? 'btn-primary' : (empty($data['active']) ? 'btn-light' : 'btn-secondary'),   // Change the default class for highlighted/active toggles here
             empty($data['id']) ? '' : 'id="' . h($data['id']) . '"',
             empty($data['url']) ? '#' : h($data['url']),    // prevent default is passed if the url is not set
             empty($onClick) ? '' : $onClick,    // pass $data['onClick'] for the function name to call and $data['onClickParams'] for the parameter list

templates/element/genericElements/ListTopBar/group_context_filters.php

@@ -11,7 +11,13 @@
         unset($currentQuery['page'], $currentQuery['limit'], $currentQuery['sort']);
         $contextArray[] = [
             'active' => $currentQuery == $filteringContext['filterCondition'],
-            'url' => $this->Url->build($urlParams),
+            'isFilter' => true,
+            'onClick' => 'UI.reload',
+            'onClickParams' => [
+                $this->Url->build($urlParams),
+                "#table-container-${tableRandomValue}",
+                "#table-container-${tableRandomValue} table.table",
+            ],
             'text' => $filteringContext['label'],
         ];
     }

webroot/js/bootstrap-helper.js

@@ -13,6 +13,20 @@ class UIFactory {
         theModal.show()
         return theModal
     }
+
+    reload (url, $container, $statusNode=null) {
+        $container = $($container)
+        $statusNode = $($statusNode)
+        if (!$statusNode) {
+            $statusNode = $container
+        }
+        const tmpApi = new AJAXApi({
+            statusNode: $statusNode[0],
+        })
+        tmpApi.fetchURL(url).then((data) => {
+            $container.html(data)
+        })
+    }
 }
 
 class Toaster {

webroot/js/main.js

@@ -42,16 +42,4 @@ var AjaxApi, UI
 $(document).ready(() => {
     AjaxApi = new AJAXApi()
     UI = new UIFactory()
-})
+})
-
-function reloadElement(url, $container, $statusNode=null) {
-    if (!$statusNode) {
-        $statusNode = $container
-    }
-    tmpApi = new AJAXApi({
-        statusNode: $statusNode[0],
-    })
-    tmpApi.fetchURL(url).then((data) => {
-        $container.html(data)
-    })
-}