I have a datagrid displaying data from a Supabase collection. I implemented a method that allows deleting a single row from both the datagrid and the corresponding table in Supabase. The process works as follows: I check the box of the row I want to delete, retrieve its ID, and store it in a variable named currentId. Then, by clicking on a trash icon, a “Delete” action is triggered to remove the selected row based on the previously retrieved currentId, and the row is deleted from the database.
However, my issue is that I can only delete one row at a time. I would like to implement a multiple row deletion feature, where I can select an unlimited number of rows and delete them all at once. Additionally, the checkbox in the header should allow selecting all rows and deleting them in a single action.
Could you please help me implement this functionality?
The best way is to create a Supabase function that takes in the array of IDs.
For what it is worth, I normally only perform soft deletes, but these requires adjusting all views and RLS to be aware of an “archived” column.
CREATE OR REPLACE FUNCTION archive_rows_by_id(p_ids UUID[])
RETURNS VOID AS $$
BEGIN
EXECUTE format(
'UPDATE table_name
SET archived = current_timestamp
WHERE id = ANY($1)
AND archived IS NULL'
) USING p_ids;
END;
$$ LANGUAGE plpgsql;
Hello, thank you for your response. I’ve found a simpler method. You just need to add a button or an icon to the page of your DataGrid, which will be linked to the delete action. A simple trash icon or a button with the text “Delete” will do. For these components, you need to create a workflow named: “Data Deletion” with an event: “On click”. Then, use a “iterator (for loop)” as the action to loop through the default array of your DataGrid, “Datagrid-selectedRows”, which is used to get the list of currently selected rows.
In this loop, add an action that executes a delete query of type: Database | Delete. In this action, select your pre-configured collection linked to your database table. For “Delete by”, choose “Primary keys”, and for “id”, use a formula which will be: Datagrid-selectRows[Action.loop.index].id. This formula dynamically deletes each selected row by accessing its ID (id) during the loop iteration.
After the delete action, add an action to refresh the DataGrid. This can be done by triggering an action of type “fetch collection” (fetch the current collection data of the DataGrid), which will refresh the displayed data.
