I’m working on a Salesforce Lightning Web Component where I need to manage a list of records that users can edit and delete. Each record is represented in a data table with an action button to delete it. While the first record deletes without issue, attempting to delete a second record fails, and I haven’t been able to pinpoint the cause. Below is the relevant part of my component code:
handleRowAction(event) {
const actionName = event.detail.action.name;
const rowIndex = event.detail.row.rowNumber;
try {
if (actionName === 'deleteRecord') {
this.deleteLocalRecord(rowIndex);
}
} catch (error) {
console.error('Error handling row action:', error);
this.dispatchEvent(
new ShowToastEvent({
title: 'Error',
message: 'Failed to delete record. Record not found.',
variant: 'error'
})
);
}
}
deleteLocalRecord(index) {
const adjustedIndex = this.records.findIndex(record => record.rowNumber === index);
if (adjustedIndex >= 0 && adjustedIndex < this.records.length) {
this.records.splice(adjustedIndex, 1);
this.records = [...this.records]; // Ensure reactive update
// Additional handling omitted for brevity
} else {
console.error('Invalid index:', adjustedIndex);
this.dispatchEvent(new ShowToastEvent({
title: 'Error',
message: 'Invalid index for deletion',
variant: 'error'
}));
}
}
The first deletion works fine, but the second deletion causes the component to fail without any meaningful errors shown in the browser console, except for the generic message that the record could not be found.
Why might the handleRowAction method fail when attempting to delete a second record?
How can I improve error handling or the deletion logic to handle multiple deletions correctly?
Any insights or suggestions would be greatly appreciated!
Multiple deletions to work correctly, I tried debugging with console logs and modifying the handle row action.
TOSB is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.