diff --git a/templates/element/genericElements/ListTopBar/group_table_action/compactDisplay.php b/templates/element/genericElements/ListTopBar/group_table_action/compactDisplay.php index 312ad37..28eaa4d 100644 --- a/templates/element/genericElements/ListTopBar/group_table_action/compactDisplay.php +++ b/templates/element/genericElements/ListTopBar/group_table_action/compactDisplay.php @@ -41,6 +41,7 @@ $compactDisplayInputSeed = 'seed-' . mt_rand(); const $container = $dropdownMenu.closest('div[id^="table-container-"]') const $table = $container.find(`table[data-table-random-value="${tableRandomValue}"]`) toggleCompactState($checkbox[0].checked, $table) + registerDebouncedFunction($container, debouncedCompactSaver) }) })() \ No newline at end of file diff --git a/templates/element/genericElements/ListTopBar/group_table_action/hiddenColumns.php b/templates/element/genericElements/ListTopBar/group_table_action/hiddenColumns.php index 3a95b82..8e14c6d 100644 --- a/templates/element/genericElements/ListTopBar/group_table_action/hiddenColumns.php +++ b/templates/element/genericElements/ListTopBar/group_table_action/hiddenColumns.php @@ -40,7 +40,8 @@ echo $availableColumnsHtml; const debouncedHiddenColumnSaverWithReload = debounce(mergeAndSaveSettingsWithReload, 2000) function attachListeners() { - let debouncedFunctionWithReload = false, debouncedFunction = false // used to flush debounce function if dropdown menu gets closed + let debouncedFunctionWithReload = false, + debouncedFunction = false // used to flush debounce function if dropdown menu gets closed $('form.visible-column-form, form.visible-meta-column-form').find('input').change(function() { const $dropdownMenu = $(this).closest(`[data-table-random-value]`) const tableRandomValue = $dropdownMenu.attr('data-table-random-value') @@ -108,24 +109,6 @@ echo $availableColumnsHtml; return tableSetting } - function mergeAndSaveSettingsWithReload(table_setting_id, tableSettings, $table) { - mergeAndSaveSettings(table_setting_id, tableSettings, false).then((apiResult) => { - const theToast = UI.toast({ - variant: 'success', - title: apiResult.message, - bodyHtml: $('
').append( - $('').text('= __('The table needs to be reloaded for the new fields to be included.') ?>'), - $('').addClass(['btn', 'btn-primary', 'btn-sm', 'ms-3']).text('= __('Reload table') ?>').click(function() { - const reloadUrl = $table.data('reload-url'); - UI.reload(reloadUrl, $table.closest('div[id^="table-container-"]'), $(this)).then(() => { - theToast.removeToast() - }) - }), - ), - }) - }) - } - $(document).ready(function() { addSupportOfNestedDropdown(); const $form = $('form.visible-column-form, form.visible-meta-column-form') @@ -138,6 +121,8 @@ echo $availableColumnsHtml; toggleColumn(this.getAttribute('data-columnname'), this.checked, $table) }) attachListeners() + registerDebouncedFunction($container, debouncedHiddenColumnSaver) + registerDebouncedFunction($container, debouncedHiddenColumnSaverWithReload) }) })() \ No newline at end of file diff --git a/webroot/js/table-settings.js b/webroot/js/table-settings.js index 2d1e3ea..906a3c4 100644 --- a/webroot/js/table-settings.js +++ b/webroot/js/table-settings.js @@ -10,6 +10,41 @@ function mergeAndSaveSettings(table_setting_id, newTableSettings, automaticFeedb }) } +function mergeAndSaveSettingsWithReload(table_setting_id, tableSettings, $table) { + mergeAndSaveSettings(table_setting_id, tableSettings, false).then((apiResult) => { + const theToast = UI.toast({ + variant: 'success', + title: apiResult.message, + bodyHtml: $('').append( + $('').text('The table needs to be reloaded for the new fields to be included.'), + $('').addClass(['btn', 'btn-primary', 'btn-sm', 'ms-3']).text('Reload table').click(function () { + const reloadUrl = $table.data('reload-url'); + UI.reload(reloadUrl, $table.closest('div[id^="table-container-"]'), $(this)).then(() => { + theToast.removeToast() + }) + }), + ), + }) + }) +} + +function registerDebouncedFunction($container, fn) { + $dropdownButton = $container.find('button.table_setting_dropdown_button') + if ($dropdownButton.data('debouncedFunctions') === undefined) { + $dropdownButton.data('debouncedFunctions', []) + } + $dropdownButton.data('debouncedFunctions').push(fn) +} + +function firePendingDebouncedFunctions(dropdownBtn) { + $dropdownButton = $(dropdownBtn) + if ($dropdownButton.data('debouncedFunctions') !== undefined) { + $dropdownButton.data('debouncedFunctions').forEach(function (fn) { + fn.flush() + }) + } +} + function mergeNewTableSettingsIntoOld(table_setting_id, oldTableSettings, newTableSettings) { // Merge recursively tableSettings = Object.assign({}, oldTableSettings, newTableSettings)