To save changes to an existing record, load the record in EDIT mode and call saveRecord on the force:recordData component.
To save a new record, and thus create it, create the record from a record template, as described in Creating a Record. Then call saveRecord on the force:recordData component.
To perform the save operation, call saveRecord on the force:recordData component from the appropriate controller action handler. saveRecord 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.
The following example illustrates the essentials of saving a record using Lightning Data Service. It’s intended for use on a record page. The record ID is supplied by the implicit recordId attribute added by the force:hasRecordId interface.
<<aura:component implements="flexipage:availableForRecordHome,force:hasRecordId"> <aura:attribute name="record" type="Object"/> <aura:attribute name="simpleRecord" type="Object"/> <aura:attribute name="recordError" type="String"/> <force:recordData aura:id="recordHandler" recordId="{!v.recordId}" layoutType="FULL" targetRecord="{!v.record}" targetFields="{!v.simpleRecord}" targetError="{!v.recordError}" mode="EDIT" recordUpdated="{!c.handleRecordUpdated}" /> <!-- Display a header with details about the record --> <div class="slds-page-header" role="banner"> <p class="slds-text-heading--label">Edit Record</p> <h1 class="slds-page-header__title slds-m-right--small slds-truncate slds-align-left">{!v.simpleRecord.Name}</h1> </div> <!-- Display Lightning Data Service errors, if any --> <aura:if isTrue="{!not(empty(v.recordError))}"> <div class="recordError"> <ui:message title="Error" severity="error" closable="true"> {!v.recordError} </ui:message> </div> </aura:if> <!-- Display an editing form --> <lightning:input aura:id="recordName" name="recordName" label="Name" value="{!v.simpleRecord.Name}" required="true"/> <lightning:button label="Save Record" onclick="{!c.handleSaveRecord}" variant="brand" class="slds-m-top--medium"/> </aura:component>
({ handleSaveRecord: function(component, event, helper) { component.find("recordHandler").saveRecord($A.getCallback(function(saveResult) { // NOTE: If you want a specific behavior(an action or UI behavior) when this action is successful // then handle that in a callback (generic logic when record is changed should be handled in recordUpdated event handler) if (saveResult.state === "SUCCESS" || saveResult.state === "DRAFT") { // handle component related logic in event handler } else if (saveResult.state === "INCOMPLETE") { console.log("User is offline, device doesn't support drafts."); } else if (saveResult.state === "ERROR") { console.log('Problem saving record, error: ' + JSON.stringify(saveResult.error)); } else { console.log('Unknown problem, state: ' + saveResult.state + ', error: ' + JSON.stringify(saveResult.error)); } })); }, /** * Control the component behavior here when record is changed (via any component) */ handleRecordUpdated: function(component, event, helper) { var eventParams = event.getParams(); if(eventParams.changeType === "CHANGED") { // get the fields that changed for this record var changedFields = eventParams.changedFields; console.log('Fields that are changed: ' + JSON.stringify(changedFields)); // record is changed, so refresh the component (or other component logic) var resultsToast = $A.get("e.force:showToast"); resultsToast.setParams({ "title": "Saved", "message": "The record was updated." }); resultsToast.fire(); } else if(eventParams.changeType === "LOADED") { // record is loaded in the cache } else if(eventParams.changeType === "REMOVED") { // record is deleted and removed from the cache } else if(eventParams.changeType === "ERROR") { // there’s an error while loading, saving or deleting the record } } })