Trigger API call from one table to populate another

💬 App Building
1

[ Disclaimer: Complete n00b here! ]

  • Goal: I am loading one table with a list of message queues and when double clicking one of the rows I want to populate another table from another API call with the messages available on the queue.

  • Steps: I can get both tables loaded from the API's and I have a "double-click" interaction that sets the queue name to a text box and this works fine. In the URL for the call to populate messages I've set the value of the textbox as ?q={{ txtSelectedQueue.value }} for a query string and this sends the request to the API.

  • Details: The problem I am having that the second API is called in a "loop", it keeps calling the API over and over again with the value from the text box. Why is this happening?

So, to summarize, when I load the page the table with message queue names is populated.
I double click a row and it populates a text box with the name.
Then an infinite looping starts when it keeps calling and calling the second API to populate the second table.

Also, it seems as if the "control component" for the second table is called "automatically" as soon as the value is set/changes in the text box.
Is this because I have the ?q={{ txtSelectedQueue.value }} in the URL?

2

Not sure if this is the way to go, but I added a button and another hidden text box.

When double-clicking a row in the first table, I populate the value of txtSelectedQueue (the previous text box).

When I then click the button, I set the value of the new hidden text box txtPopulateSelectedQueueMessages and then I changed the URL for the API call to use txtPopulateSelectedQueueMessages instead.

This seems to do what I want, but it kind of feels overly complex... :disappointed_relieved:

3

Hey @QAnders,

So, if I understand correctly, the approach I would suggest is:

  • unless you need the text boxes for something else, which I don't think this is the case as you are hiding them, you can refer directly to the value in your table. Therefore, I would create an event handler in my table which triggers my query on double click
  • change the parameter in your query from txtSelectedQueue.value to yourTable.selectedSourceRow.yourField
    -you can decide to change the "Run Behavior" settings in your query to "Manual" so that it runs only when triggered, in this case when your table's event handler triggers.

Hope this helps! Feel free to share more about yoru set up with screenshots so it is easier to understand your use case.

4

OK, thanks, so setting the query to "Manual" would mean it only executes when I double-click a row, and not every time the value in the textbox changes (as it initially did)?

Indeed, I don't need the text boxes, but I couldn't figure out how to populate the second table, but now I understand that the second table is "attached" to the Query (=API) and is updated when the Query is triggered (through the event then of double-clicking).

I'll give that a go, and let you know! Thanks!

Oh, by the way, is there some way to clear the table?
Now when I select a new Queue in the first table and wait for it to load messages, the old messages are stil lin the second table... Ideally I'd like to clear the second table when double-clicking a new row...
I tried with the "clear" options and a script as tbl.reset() prior to executing the refresh but the table was not cleared...

1 Like
5

What you could do is Reset the query before running it again, by doing this the data in the query will be null until it finishes running. As such, your table will be empty.

Event handlers for queries have the "Reset" option.

image

6

Perfect!

Yes, setting the Query to Manual did the trick!

And, as an added bonus, running the reset on the Query prior to executing the loading of it again indeed clears the table!

Thank you! :pray:

1 Like