diff --git a/frontend/src/AppBuilder/WidgetManager/widgets/table.js b/frontend/src/AppBuilder/WidgetManager/widgets/table.js
index ff815bab07..8a89701494 100644
--- a/frontend/src/AppBuilder/WidgetManager/widgets/table.js
+++ b/frontend/src/AppBuilder/WidgetManager/widgets/table.js
@@ -289,6 +289,7 @@ export const tableConfig = {
onCellValueChanged: { displayName: 'Cell value changed' },
onFilterChanged: { displayName: 'Filter changed' },
onNewRowsAdded: { displayName: 'Add new rows' },
+ onTableDataDownload: { displayName: 'Download data' },
},
styles: {
textColor: {
diff --git a/frontend/src/AppBuilder/Widgets/Table/Components/Footer.jsx b/frontend/src/AppBuilder/Widgets/Table/Components/Footer.jsx
index 3d983d59fc..45a3fd19b2 100644
--- a/frontend/src/AppBuilder/Widgets/Table/Components/Footer.jsx
+++ b/frontend/src/AppBuilder/Widgets/Table/Components/Footer.jsx
@@ -58,6 +58,7 @@ export const Footer = React.memo(
showAddNewRowPopup,
downlaodPopover,
getToggleHideAllColumnsProps,
+ isDownloadTableDataEventAssociated,
}) => {
function hideColumnsPopover() {
return (
@@ -223,32 +224,57 @@ export const Footer = React.memo(
)}
{!loadingState && showDownloadButton && (
-
-
- {
- if (document.activeElement === e.currentTarget) {
- e.currentTarget.blur();
- }
- }}
- >
-
+ {
+ // if server side pagination is enabled and download event is associated with the table, then directly fire download event without displaying popover
+ isDownloadTableDataEventAssociated && !clientSidePagination ? (
+ <>
+
+ fireEvent('onTableDataDownload')}
+ >
+ >
+ ) : (
+ <>
+
+
+ {
+ if (document.activeElement === e.currentTarget) {
+ e.currentTarget.blur();
+ }
+ }}
+ >
+
+ >
+ )
+ }
)}
{!loadingState && !hideColumnSelectorButton && (
diff --git a/frontend/src/AppBuilder/Widgets/Table/Table.jsx b/frontend/src/AppBuilder/Widgets/Table/Table.jsx
index c38294eab7..17714791cf 100644
--- a/frontend/src/AppBuilder/Widgets/Table/Table.jsx
+++ b/frontend/src/AppBuilder/Widgets/Table/Table.jsx
@@ -154,6 +154,7 @@ export const Table = React.memo(
const [tableDetails, dispatch] = useReducer(reducer, initialState());
const [hoverAdded, setHoverAdded] = useState(false);
const [generatedColumn, setGeneratedColumn] = useState([]);
+ const [isDownloadTableDataEventAssociated, setIsDownloadTableDataEventAssociated] = useState(false);
const mergeToTableDetails = useCallback((payload) => dispatch(reducerActions.mergeToTableDetails(payload)), []);
const mergeToFilterDetails = (payload) => dispatch(reducerActions.mergeToFilterDetails(payload));
@@ -175,6 +176,9 @@ export const Table = React.memo(
useEffect(() => mergeToTableDetails({ columnProperties: properties?.columns }), [properties?.columns]);
useEffect(() => {
+ const isDownloadTableDataEventAssociated = tableEvents.some((event) => event?.name === 'onTableDataDownload');
+ if (isDownloadTableDataEventAssociated) setIsDownloadTableDataEventAssociated(true);
+ else setIsDownloadTableDataEventAssociated(false);
const hoverEvent = tableEvents?.find(({ event }) => {
return event?.eventId == 'onRowHovered';
});
@@ -1167,6 +1171,7 @@ export const Table = React.memo(
{loadingState ? : page.length === 0 ? : null}