Deleting a Record

To delete a record using Lightning Data Service, call deleteRecord on the force:recordPreview component, and pass in a callback function to be invoked after the delete operation completes.

Delete operations with Lightning Data Service are straightforward. The force:recordPreview tag can include minimal details. If you don’t need any record data, set the fields attribute to just Id. If you know that the only operation is a delete, any mode can be used.

To perform the delete operation, call deleteRecord on the force:recordPreview component from the appropriate controller action handler. deleteRecord takes one argument, a callback function to be invoked when the operation completes. This callback function receives a SaveRecordResult as its only parameter. SaveRecordResult includes a state attribute that indicates success or error, and other details you can use to handle the result of the operation.

Deleting a Record

The following example illustrates the essentials of deleting a record using Lightning Data Service. This component adds a Delete Record button to a record page, which deletes the record being displayed. The record ID is supplied by the implicit recordId attribute added by the force:hasRecordId interface.

ldsDelete.cmp

1<aura:component
2    implements="flexipage:availableForRecordHome,force:hasRecordId">
3
4    <aura:attribute name="recordError" type="String" access="private"/>
5    <force:recordPreview aura:id="recordHandler"
6      recordId="{!v.recordId}"
7      fields="Id"
8      targetError="{!v.recordError}"
9      />
10
11    <!-- Display Lightning Data Service errors, if any -->
12    <aura:if isTrue="{!not(empty(v.recordError))}">
13        <div class="recordError">
14            <ui:message title="Error" severity="error" closable="true">
15                {!v.recordError}
16            </ui:message>
17        </div>
18    </aura:if>
19
20    <div class="slds-form-element">
21        <ui:button
22            label="Delete Record"
23            press="{!c.handleDeleteRecord}"
24            class="slds-button slds-button--brand" />
25    </div>
26
27</aura:component>

Notice that the force:recordPreview tag includes only the recordId and a nearly empty fields list—the absolute minimum required. If you want to display record values in the user interface, for example, as part of a confirmation message, define the force:recordPreview tag as you would for a load operation, instead of this minimal delete example.

ldsDeleteController.js

1({
2    handleDeleteRecord: function(component, event, helper) {
3        component.find("recordHandler").deleteRecord($A.getCallback(function(saveResult) {
4            if (saveResult.state === "SUCCESS" || saveResult.state === "DRAFT") {
5
6                // Deleted! Show a toast UI message
7                var resultsToast = $A.get("e.force:showToast");
8                resultsToast.setParams({
9                    "title": "Deleted",
10                    "message": "The record was deleted."
11                });
12                resultsToast.fire();
13
14                // Navigate to deleted record's object home
15                var goToObjectHome = $A.get("e.force:navigateToObjectHome");
16                goToObjectHome.setParams({
17                    "scope": saveResult.entityApiName
18                });
19                goToObjectHome.fire();
20            }
21            else if (saveResult.state === "INCOMPLETE") {
22                console.log("User is offline, device doesn't support drafts.");
23            }
24            else if (saveResult.state === "ERROR") {
25                console.log('Problem deleting record, error: ' +
26                            JSON.stringify(saveResult.error));
27            }
28            else {
29                console.log('Unknown problem, state: ' + saveResult.state +
30                            ', error: ' + JSON.stringify(saveResult.error));
31            }
32        }));
33    }
34})

When the record is deleted, you need to navigate away from the record page, or you’ll see a “record not found” error when the component refreshes. Here the controller uses the entityApiName property in the SaveRecordResult provided to the callback function, and navigates to the object home page.

Lightning Components Developer Guide

Deleting a Record

Deleting a Record

See Also: