force:recordData In Lightning

Following methods are supported:

1).  getNewRecord : Set the record to target record.

2). reloadRecord : Perform the load function on init using current configuration value.

3). saveRecord : To save the record.

4). deleteRecord:  To delete the record.

 In this example we are going to create a lightning component which modify the name of the current  account without using server side controller (Apex Class), means all action perform on client side by using lightning data service.  Let’s see how it works.

1). Create a new component with following code:

<aura:component implements="flexipage:availableForRecordHome,force:hasRecordId"> <!--inherit recordId attribute-->

     <!-- 
    /**
    * Webkul Software.
    *
    * @category  Webkul
    * @author    Webkul
    * @copyright Copyright (c) 2010-2016 Webkul Software Private Limited (https://webkul.com)
    * @license   https://store.webkul.com/license.html
    */
    -->
    
<aura:attribute name="record" type="Object" />
<aura:attribute name="simpleRecord" type="Object" />
<aura:attribute name="recordError" type="String" />

<force:recordData aura:id="recordEditor"
    layoutType="COMPACT"
    recordId="{!v.recordId}"
    targetError="{!v.recordError}"
    targetRecord="{!v.record}"
    targetFields="{!v.simpleRecord}"
    mode="EDIT" />

    <!-- Display a header with details about the record -->
    <div class="slds-form--stacked">
        <div class="slds-form-element">
            <label class="slds-form-element__label" for="recordName">Name: </label>
            <div class="slds-form-element__control">
              <ui:outputText class="slds-input" aura:id="recordName"
                value="{!v.simpleRecord.Name}" />
            </div>
        </div>
    </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>

2). Now, create client side controller as follows:

({
     /**
    * Webkul Software.
    *
    * @category  Webkul
    * @author    Webkul
    * @copyright Copyright (c) 2010-2016 Webkul Software Private Limited (https://webkul.com)
    * @license   https://store.webkul.com/license.html
    */
    
    handleSaveRecord: function(component, event, helper) {
        component.find("recordEditor").saveRecord($A.getCallback(function(saveResult) {
            if (saveResult.state === "SUCCESS" || saveResult.state === "DRAFT") {
                console.log("Save completed successfully.");
            } 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));
            }
        }));}
})