How to change table custom column values programmatically?

Queries and Resources
1

Hello! I have a table with a custom column with "Checkbox" type to select entries in columns for bulk state change (enabled/disabled). I want to create a button with "Select All" action, to set all checkboxes to true.
The issue, that I can't use table.setData(), as custom columns are not part of original data. I've tried to edit table.changeSet and table.Record updates, but without any luck.

Is it any approach, to update custom columns or should I found the way with the default "Allow selecting multiple row" feature? (Which is not the best solution for me, as I have an entry edit for attached to table.selectedRow.)

Thanks for your help!

2

Hey yauheni! One workaround here would be to append a boolean column to your table data itself. This way, the checkbox column would not be a custom column and you could use table.setData to set all of the checkboxes to true programmatically. You would need to both append and remove a boolean field to the data that populates your table when pulling it into and passing it out of Retool using a JS transformer or a JS query.

Here's an example of what this could look like

5116×2480 984 KB

You can add a transformer to your query to add the boolean field. You'll want to set the values to null so that its possible to track any changes in the table.recordUpdates value.

1736×500 44.7 KB

You can then have a button or some other UI action trigger a query that sets all the 'Selected' fields to true using the table2.setData method.

1604×474 59 KB

And you could then set up a transformer to return only the rows where 'Selected' has been set to true and to remove the selected field from those rows so you don't have to worry about dealing with the added field on the backend.

I hope that makes sense and can work for your use case :smile:

3

Thanks a lot for introducing me to the additional approach, looks great! Will try to apply for my case.

1 Like
4

Hi !

I've exactly the same requirement: propose a button to 'prefill' some updates on a table to facilitate data provisionning before hitting 'save' and triggering the bulk update.

Your solutions works for setting the new datas (i've tested on several columns, including a "test" column pre-set to null in a transformer as you suggested).

But neither recordUpdates nor changeSet are updated (and we can see in the cells are not yellow) and the SAVE button is not displayed in the table.

Before:

before
before437×655 5.22 KB

After:

after
after436×677 12.4 KB

table_after_no_changeset

table_after_no_recordupdate

Code:

table.setData(table.data.map(d => { 
  d["responsible_condi"] = "tututoto";
  d.ok_condi = true;
  d.count_condi = d.quantity_to_condi;
  d.test = true;
  return d;
}));

am I missing something ?

Thanks,
Regards,
Thomas

5

Hey Thomas — I believe with this setup since you are changing the input data rather than explicitly making these changes, recordUpdates and changeSet would not change until a user makes a change to your dataset manually. I don't think there is any way to programmatically change values in a custom column at the moment that are also reflected in these properties.

6

Hi damn, this it too bad.

But wait: I my case the columns are not custom columns, but columns from the table.data
Do you think there is another approach to progammatically change values of table 'standard' columns that can be reflected in changeSet and recordUpdates ?

7

I don't believe where either changeSet or recordUpdates would be populated but you could change the input data and use a button external to the table to run the bulk update (you could even disable this button by comparing the data from your db and the data after programmatically updating it). Are you looking to programmatically change and update this to your db in one action or separately update and then trigger the bulk update action?

8

The objective was to separate the two actions to let the user the possibility to 'microchange' the mass update before triggering the real bulk update.
Thanks for your response.

9

Hi Chris,
has there been any progress on this one?
My client needs this functionality too.
It makes it confusing and non-intuitive to the user to have two separate buttons - "Save Changes", "Bulk Update" - to update data.

10

Hey @ales!

No updates on the original issue here but if you have a custom column in a table and a user makes updates to it, you can find these changes in {{table.changeSet}} and use these values for a bulk update to your DB. Is this what you're looking to do here?

11

Hi @Chris-Thompson,
what I need is to be able to change the table.changeSet programatically.
I want to use a JS query to update values of some cells so user can see the changes and can click on the Save button. Like he had changed it manually by clicking in the cell and editing.

12

Try this:
https://docs.retool.com/docs/working-with-tables#editing-table-values-making-data-editable

13