Issue
I want to be able to disable/enable a particular row in a table on a button click. I can use the storeValue function to store the selected row index and then bind it to the Default Selected Row of the table to disable/enable it. Alternatively, I can use resetWidget function to remove any selected rows. However, I cannot edit row values, only perform actions on columns with buttons or icons.
Resolution
You can disable the action button for the specific row that was clicked by storing that row’s ID and binding the Button column’s Disabled property to it.
1) Add a stable row identifier
Make sure your table data has a unique id
(or set the Table’s Primary key column accordingly). This helps reliably target the clicked row.
2) Toggle a list of “disabled” row IDs on click
In the Button (or Icon Button) column → onClick, enable JS and use the row that fired the event via Table1.triggeredRow
(see Column settings for triggeredRow
/currentRow
). Then update the store using storeValue()
with session-only persistence (persist=false
):
{{
const id = Table1.triggeredRow.id;
const list = appsmith.store.disabledRowIds || [];
const next = list.includes(id)
? list.filter(x => x !== id) // re-enable if already disabled
: [...list, id]; // disable if not yet disabled
storeValue("disabledRowIds", next, false); // session-only
}}
3) Disable the button per row
In the same Button column → Disabled (JS):
{{ (appsmith.store.disabledRowIds || []).includes(currentRow.id) }}
Optional resets
- Remove just this key later with
removeValue("disabledRowIds")
. - To clear selection (if needed):
Table1.setSelectedRowIndices([])
.
See: Table widget (Primary key column, reference properties like triggeredRow
), Column settings (Button/Icon Button), storeValue()
, removeValue()
.