diff --git a/pandora_console/include/functions_ui.php b/pandora_console/include/functions_ui.php index d0e747e031..6b6b446f7d 100755 --- a/pandora_console/include/functions_ui.php +++ b/pandora_console/include/functions_ui.php @@ -3416,7 +3416,17 @@ function ui_print_datatable(array $parameters) } // Languages. - $processing = __('Processing'); + $processing = '
'; + $processing .= ''.__('Processing').' '; + $processing .= str_replace( + '"', + "'", + html_print_image( + 'images/spinner.gif', + true + ) + ); + $processing .= '
'; // Extra html. $extra = ''; @@ -3524,6 +3534,10 @@ function ui_print_datatable(array $parameters) url: "'.ui_get_full_url('ajax.php', false, false, false).'", type: "POST", dataSrc: function (json) { + if($("#'.$form_id.'_search_bt") != undefined) { + $("#'.$form_id.'_loading").remove(); + } + if (json.error) { console.error(json.error); $("#error-'.$table_id.'").html(json.error); @@ -3570,6 +3584,18 @@ function ui_print_datatable(array $parameters) } }, data: function (data) { + if($("#'.$form_id.'_search_bt") != undefined) { + var loading = \''.html_print_image( + 'images/spinner.gif', + true, + [ + 'id' => $form_id.'_loading', + 'class' => 'loading-search-datatables-button', + ] + ).'\'; + $("#'.$form_id.'_search_bt").parent().append(loading); + } + inputs = $("#'.$form_id.' :input"); values = {}; diff --git a/pandora_console/include/styles/pandora.css b/pandora_console/include/styles/pandora.css index ae109ba20d..33a221c2ae 100644 --- a/pandora_console/include/styles/pandora.css +++ b/pandora_console/include/styles/pandora.css @@ -9077,3 +9077,33 @@ div#err_msg_centralised { margin-bottom: 4px !important; padding: 2px 5px !important; } + +.dataTables_wrapper { + overflow: auto; +} + +.dataTables_wrapper .dataTables_processing { + margin-top: -37px !important; + top: 50px !important; + padding-top: 0px !important; + height: 0px !important; + background: transparent !important; +} + +.dataTables_wrapper .dataTables_processing .processing-datatables-inside { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + height: 100%; +} + +.dataTables_wrapper .dataTables_processing .processing-datatables-inside img { + margin-left: 20px; +} + +.loading-search-datatables-button { + float: right; + margin-right: -110px; + margin-top: 13px; +}