What's the best way to api table

Question
#1

Hi there,
I’m trying to display api call data in a table. I can get it to work, but only once. What I mean is that on the initial setup of the table, I get to choose the data method, This seems to be an initial setup only option.
When I preview the page, I get the data in the table, but if I make changes on page and preview again, I get an empty table with default first row description.
I tried to empty cache and hard load but nothing helps.
I can also collect the data into a local collection successfully.
What is the expected behaviour?
Should the api run everytime I load the page?
Is there a way to store data in the browser cache to save on bandwidth and make it quicker?

cheers!

#2

Hi @eldados,

Can you please send the preview URL of the page on which you are having this issue.

Ideally anything like this shouldn’t happen as we have several projects where data comes from the API and it works perfectly fine.

Thanks.

#3

Thanks, @vishsahu,
I’m dealing with an API that pulls over 2000 records everytime I load the page, this is slow and not the best app experience. I would like to populate a local collection with the API call and give the user an option to “sync” or “refresh” the data when needed, and when a user update a record it should push the changes back to the server.
Is this an acceptable approach?
What do you think is the best way to deal with this?
As well, I noticed that the search did not work on the table, it basically just refreshed the data, any settings somewhere for that?
thank you!

#4

Hi @eldados,

It is not a good practice to bring so many records in a single API call and try to display them.

You have 2 options which are standard:

#1: You can bring the 2000 results in a paginated way, like 20 or 50 at a time and then give the option to user to naviage to the next results (this will only work when that API supports pagination, which most like it should as it is a standard practice).

Below is the video example:

#2: You can create an External API in DrapCode to store the data in the DrapCode collection and then use the regular Data Table component to display that data with pagination. In this case the search/pagination/filters etc will work without any extra effort.

Below is the video which will help:

For refreshing/sync the data via API, we do have support of background jobs which will keep on fetching the data at regular interval of times and then continue to update it at a set frequency.

Let me know if this answers your question.

Thanks.