Retool is a great tool and the fastest way to build effective business software. I use it as an internal tool for a corporate database.
The case
My application has a paginated table and when I click the export button it only downloads one page.
How I can download/export the whole table?
Solution
This option covers 2 possible cases:
- Export only selected items
- Export all items if no items are selected
How it works: Export button
- Clicking the button runs the exportAllUsersScript() script.
- Displays the loading process
- Repeated clicking of the button is blocked
API Request
I used a separate API request getUsersExportQuery just to export the data and passed one parameter which was the page number {{currentPage}}
GET https://api.com/v1/User/all/{{currentPage}}/20/
Then I call this request and pass the current page number there currentPage: i
await getUsersExportQuery.trigger({
additionalScope: {
currentPage: i,
}
});
The Script
This is a recursive function exportData(i) that calls itself until we reach the end of the data. See comments inside the script for details
let data = [];
const selectedItems = table.selectedSourceRows;
// Main function
async function exportData(i) {
// Reset counter
let itemsCounter = 0;
// Execute the request + pass page number
await getUsersExportQuery.trigger({
additionalScope: {
currentPage: i,
},
onSuccess: function (response) {
if (typeof response?.items !== 'undefined') {
// Set counter
itemsCounter = response?.items.length;
if (itemsCounter > 0) {
response.items.forEach(function(item) {
data.push(item);
});
}
}
},
onFailure: function (error) {
data = {};
},
});
// if there is data, the function will be called again
// and increment page + 1
if (itemsCounter > 0) {
await exportData(i + 1);
}
}
// Export only selected items
if (selectedItems.length > 0) {
data = selectedItems;
// Export all items
} else {
await exportData(0);
}
utils.exportData(data, 'all_Items', 'csv')
return data;