diff --git a/packages/devextreme/js/__internal/grids/grid_core/m_utils.ts b/packages/devextreme/js/__internal/grids/grid_core/m_utils.ts
index 5142d62f131c..a64523e02abf 100644
--- a/packages/devextreme/js/__internal/grids/grid_core/m_utils.ts
+++ b/packages/devextreme/js/__internal/grids/grid_core/m_utils.ts
@@ -23,6 +23,8 @@ import type { ColumnPoint } from '@ts/grids/grid_core/m_types';
 
 import { isEqualSelectors, isSelectorEqualWithCallback } from './utils/index';
 
+const BASE_LOAD_PANEL_Z_INDEX = 1000;
+
 const DATAGRID_SELECTION_DISABLED_CLASS = 'dx-selection-disabled';
 const DATAGRID_GROUP_OPENED_CLASS = 'dx-datagrid-group-opened';
 const DATAGRID_GROUP_CLOSED_CLASS = 'dx-datagrid-group-closed';
@@ -230,6 +232,10 @@ export default {
         shading: false,
         message: loadPanelOptions.text,
         container: $container,
+        onShown: ({ component }) => {
+          component._$wrapper.css('zIndex', BASE_LOAD_PANEL_Z_INDEX);
+          component._$content.css('zIndex', BASE_LOAD_PANEL_Z_INDEX);
+        },
       }, loadPanelOptions);
 
       that._loadPanel = that._createComponent($('<div>').appendTo($container), LoadPanel, loadPanelOptions);