I've got this query as a resource for a custom collection. It has pagination. But when I add the following to the query, it will run 2 times on page load:
It's triggered by those variables a second time. (this query is not set to run on load or on screen load). The query is set to automatic. You would expect it only loads once because it's trigger by the component as it is the resource of that component.
When I do the following, it only runs one time:
LIMIT 5
OFFSET {{ selectedPageIndex.value * 5 }};
I added a retool variable and this seems to be fine. This doesn't trigger the query 2 times: selectedPageIndex.value
Edit:
For anyone who has also this issue: you can run a js query periodically to set the variable:
if(lineItemList.selectedPageIndex!=undefined){
if (selectedPageIndex.value!==lineItemList.selectedPageIndex)
{
selectedPageIndex.setValue(lineItemList.selectedPageIndex);
}
}
Pagination works then. It's not pretty. But it works.
Hey @Steven_W! The reason you're seeing the original query run twice is that all resource queries set to run in "Automatic" mode will execute both on page load and on change to any of its inputs, unless you're conditionally disabling it via its "Advanced" settings. I'm guessing that your proposed solution works because you set selectedPageIndex to have a default value, meaning it is static on initial page load.
It can be a little tedious but I've been encouraging folks to conditionally disable queries that would otherwise run automatically:
How would you disable it in this case if you would use the normal implementation with collectionList.pagination.selectedPageIndex * collectionList.pagination.pageSize ?
What is usually best practice in this case because it seems to me that the basic pagination method just doesn’t work.
Keep in mind that without the query set to automatic it doesn’t work at all on retool mobile.
Hmm maybe I'm misunderstanding - are you able to share your app JSON? If you do set the query to "Manual", you would also need to explicitly trigger it whenever switching pages.
The way it behaves is that when it is set to automatic, it will run on load as yous said, but it will run again some seconds later. I removed parts of the query to troubleshoot.
Removing this part from the query stops running it two times and it will only run once if no other input variables change. From this I conclude that this part causes the second run.
This might mean that the component is not fully mounted/loaded and that pageSize is the culprit or perhaps pageIndex is somehow initiated later on which retool runs the query again.
PageSize and pageIndex are not changed by my code.
About pagination and manual:
Whenever you set a query to manual, it will not run when input variables are changed. With input variables I mean the {{ }} variables in the query. Changing the page with the pagination buttons that Retool displays, does change the pageIndex. But since I have no option to add an event handler on these buttons, I cannot trigger the query manually. Therefore I have to run a script periodically to check if the pageIndex has changed and then trigger the query. This works but it doesn’t seem desirable.
This is on mobile.
Edit:
I made a workaround. I set the query to manual and disabled pagination. I then add my own buttons for pagination where I can add an event handler. But it seems a lot of hassle and it should just work out of the box in my opinion.
Ah okay - I was missing this piece of information. The workaround I suggested definitely wouldn't work if you're unable to define event handlers on those buttons.
This is exactly what I think is happening, as well. One or both of those variables are changing shortly after the page loads, which is causing your query to run again. I don't know why, though. I did some testing and am unable to replicate the behavior:
I did some testing and am unable to replicate the behavior: