New Table Component - dynamically set column editability based on other column data for a given row

[Justin_Bartell]

The team at office hours enabled the new table component for me, and I noticed there is the "FX" next to the "Editable" checkbox when you click in to configure a column for the table.

I am trying to use that, but don't really know how and am looking for some help. Here's a pretty basic example:
Table: test_table
Columns in test_table:

• column_a: Text
• column_b: Text

Users should be able to edit column_b for a row when column_a is set to "Yes" for that row.
Users should not be able to edit column_b for a row when column_a is set to "No" for that row.

I've tried writing the following code for column_b's dynamically editable code section:

{{test_table.selectedRow.column_a == "Yes" ? true : false}}

This doesn't work because when I am on any row where column_a = "Yes", then column_b is editable for ALL rows. If I click on any other row, even where column_a = "No", retool first puts me in the cell editor before actually noticing that the row I have now selected and am editing does not match the dynamic editing criteria. Through this very common "edge case" I am able to edit column_b for rows where column_a = "No".

Seems to me that Retool either needs to:

1. In the new Table Component we need access to a new "hoveredRow" property of sorts (made that name up) that I would replace "selectedRow" in my code, allowing my code to see the values of the row the user is hovering over before they actually click into it.
   OR
2. When clicking into a cell to edit it, the app should FIRST select the row, which would change the data in test_table.selectedRow, THEN evaluate the column's editability for the row I selected. I feel like this is expected behavior...

I reckon that both would be good additions, but the second one seems like a bug to me.

Let me know if anyone knows of any workarounds - my app, and thus the whole world, depends on it!

[Alexi]

Hi @Justin_Bartell!

You should be able to reference currentSourceRow in the "Editable" field. Here's an example:

currentSourceRow is a mapped property, and is a reference to the current row in your datasource. Code that references mapped properties will be evaluated multiple times--in this case for every row in your table.

[Justin_Bartell]

my app, and thus the whole world, is saved. Thanks Alexi!

[jason3w]

Is there an equivalent to the old currentRow?
I'm trying to reference another cell in the row in js, but don't see it.

[victoria]

Hey @jason3w! I believe currentSourceRow is the one Let me know how that works for you!

https://docs.retool.com/docs/legacy-table-component-migration#currentrow

https://docs.retool.com/docs/build-tables#common-table-variables