I have a requirement to delete the rows using utility icon in lightning datatable. Used onrowaction, but I don't have any clue what to do in JS method. Can anyone suggest a sample code for it? or explain me through a short logic?

enter image description here


@track deleteList = [];

handleDelete(event) {
        console.log('event.detail.row : ' + JSON.stringify(event.detail.row));
        this.deleteList = event.detail.row;


<lightning-datatable key-field="id" data={mergeObjectList} columns={columnsData}
                    hide-checkbox-column show-row-number-column>

1 Answer 1


You can either remove the element with Array.prototype.splice or by way of Array.prototype.filter.

this.mergeObjectList.splice(this.mergeObjectList.findIndex(row => row.Id === event.detail.row.id), 1);


this.mergeObjectList = this.mergeObjectList.filter(row => row.id !== event.detail.row.id);
  • Sadly the first one does not work which is Array.prototype.splice and the second one is deleting all the rows and makes the table empty. Feb 4, 2021 at 17:43
  • @IndreshBhargav The first once needs @track on the variable to work. The second should also work, maybe you've mistyped something.
    – sfdcfox
    Feb 4, 2021 at 18:12

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.