Table.selectrow only works, when the table in modal is visible

App Building
,
1

Hello,

in a module a have a problem with setting the selected row of a table which is on a modal component.

The users can select the data record they want to edit from a table and that table is on a modal component and therefore not visible all the time.

When the users insert a new data record, the table should update it's data source and then the new record should be automatically set. Updating the data source works just fine, but setting the selected row to the newest record doesn't work, when the modal with the table is not visible on screen.
I save the ID of the inserted data record in the variable Current_ID, the table on the modal component is called tb_offers.

Here is the script I use for setting the row, which only works, when is table is actual visible on screen:

const idx = tb_offers.data.findIndex(el => el.cts_offers_id === Current_ID.value);
tb_offers.selectRow({mode: 'index', indexType: 'data', index: idx})

Any idea how can set the selected row, even when the table is not visible?

I checked the script with the table not on the modal component and then it always works, so I assume there is problem with the table being on the modal component.

Thanks

2

Hello!

If I'm following along correctly, hidden components (e.g. the Table) don't get controlled by event handlers.

A user asked a similar question here and in their case, the solution was to select the underlying data. During office hours, we also suggested hiding the Table using CSS rather than using the actual UI to hide it, since Tables hidden with CSS seem to work with event handlers just fine! Here's the CSS that worked (note, the first selector is for the Edit mode table and the second selector is for the Preview mode table):

#retool-widget-table1, ._retool-table1 { display: none; }

Let me know if you have any questions!

1 Like