table.exportData() function not working when called from button

App Building
1

  • Goal: I want to call a table's exportData function from a button, but I get the following error: Cannot read properties of undefined (reading 'map')

  • Steps:

    1. Create a table
    2. Create a button
    3. Set button click handler to Control component, select the table as the component, choose method Export data
    4. Click button and see error in Console

  • Details: This is using the new table component. I'm creating a separate button to export instead of using the download button on the toolbar because this table needs to be hidden. Clicking the download button on the table toolbar works correctly, so I don't think it's an issue with the data in my table.

  • Screenshots:

    image
    image2553×1713 434 KB

2

Hey there! Thanks for writing in!

Hm, how is the data of the table populated? And does any of that data or columns utilize mapping?

A quick test app I've created with a populated and empty table did not result in this error. Could you let me know if you're seeing the same here?
ExportTest.json (76.2 KB)

3

Hi @DanBlonc

I figured out this issue but found a couple others. Let me walk you through it

Hidden Tables
table.exportData() fails if the table is hidden. To work around this, in my JS query for exporting, I first unhide the table, then call exportData(), and then hide the table again at the end.

Fresh Data
The above works if the hidden table already contains the data that I needed to export. However, I want to fetch a fresh copy of the data before I export, so I added a call in the JS query to trigger the data query before calling export. However, the export still contained the old data. I'm guessing this happens because:

  • table.exportData() is powered by table.getDisplayedData()
  • The way that I'm mucking around with table.setHidden(), the displayed data is not updating synchronously after the data query completes

Exporting Server Paginated Table
After running into the above limitations, I abandoned the hidden table approach, which I originally pursued because my main table is server paginated. I realized I could just call my main table data query with no offset and limit, and then call exportData() on my main table. This caused my JS export query to be a bit messy, but works, for the most part. The last issue I ran into is that exports only start from the current page of the table, e.g. if I have a 10 row table with 100 records and I'm on page 2, my export will only contain 90 rows.

Wrapping Up
I saw suggestions in other threads to just call the data query and then use utils.exportData(), but that doesn't work for me because I need the data mapping of the table. It would be nice if Retool could build in support for exporting server-side paginated tables.

4

Thanks for that detailed breakdown @sf_tech_bro !

We've got internal requests on these and I've linked this thread to them! That way I can update you here with any news!

1 Like