How to select new row in table after create query and table refresh

App Building
1

I have an app using REST APIs.
I have an action that creates a new item with a POST call (createQuery). When that call is successful, I am refreshing a table by calling a GET call (getallQuery) that retrieves all such items (using Success Event Handlers)

What I'd like to do now is to then select the row in the table that corresponds to the new item. It obviously needs to be done after the createQuery call has completed and the table refresh has also taken place.

I tried adding a control component > table > select row (with the id from the createQuery.data.id) in the Success Event Handlers in the createQuery, but that doesn't work (as it can't be made to wait on the other event handler).

Any recommendation?

Is there even a way of selecting a row by a column value? How would I now the row index (other than involving more javascript to find it with an indexOf based on that ID?)

2

I inspired myself of Best Way To Handle Auto Selection Of New Row In Table - #2 by shawntax and decided to use a TemporaryState that gets set in the Success handlers, with the new id.

I then have a transformer that translates that id into a row index from the table data.

I then use the value of that transformer as the default index in the table.

It seems to me that this would be a fairly common use case, and therefore something that may be a bit simpler to implement?

3

Hello. Do you have a code example of what you tried which isn't working. I am kind of following what you are trying but not fully understanding.

Thank you,
Brett

1 Like
4

Hi @wabiloo Let us know if you're able to share any screenshots! I'm glad to hear you were able to find a solution for the time being