Link Button Presses to Populate Table Values

App Building
, ,
1

I want to be able to edit the values in a table through button interactions. Is this possible?

For example, can I attach behavior to my buttons (Approve, Roads, Geometry, ... ) that will populate the table's "reviewed" column upon being pressed?

The purpose of my app is for users to be able to quickly view an image and then assign it to one of several categories. Needing to go row by row clicking drops downs is prohibitively slow.

I can attach the buttons to an update query back to the source database, but pushing these updates line by line is a no go -- as it reduces speed. I want these edits to be available in the recordUpdates property so I can bulk insert every x records edited.

Anything I'm missing here? Any help is immensely valuable.

retool
retool1137×930 93.3 KB

2

Welcome to the forum @nels5722

You would have to count the number of changes being made and then run a query that will update those rows that are updated (Maybe by index?) but I don't think that's a great idea because the table will reload once the bulk updates are completed or at least should reload so that the changes can be viewed.

Have you read through this documentation?

3

Thanks for the welcome, @ScottR

I'm not sure I explained correctly. What I want to know is can I use a button to set a column value in my table in Retool? I don't want to have to edit values in my table via dropdowns within the table. But rather have a user click a button on the UI which updates the table in realtime.

After, say 20 edits, I'd then insert back to the database with these changes and reload the table with what remains. I know how to write out to the databases via SQL inserts and recordUpdates indexes, so this isn't a concern.

4

@nels5722
I guess you could take the initial data set and set the entire table into a temp state variable and render that data into a table component. Then when a user edits the table component cell it will update the values (using setIn() Temporary state) in the temp state data. And then you can run a bulk update(Your button) using the new temp data

2 Likes
5

@ScottR thanks so much. This looks promising... I will play around here and get back to you about how it goes.

What I was testing at the moment is having two tables, one being hidden, and updating the values of table 2 using INSERTs from selectedcolumn of table 1 with Query JSON with SQL.

6

@ScottR

The temporary state and setIn() combination is working like a charm! It's doing exactly what I was looking for. Thanks a ton.

I added a Temporary state to the project and initatilized it with results from a db query:

{{Initial_Pull.data}}

Then I populated my table component data source with the tempState value:

{{ tempState.value }}

And then I created a JS query to update the tempState value at the selected index.

tempState.setIn(["reviewed",table1.selectedRow.index],"approved")

I'll alter this last bit to populate the value based on the button's component name using triggeredById so I can reuse it across all the different button click EventHandlers.

2 Likes
7

Happy to hear it!

1 Like
8