Another Salesforce blog!!!

Salesforce, Apex

Lightning Data Service Basics


Link Lightning Data Service Basics

Let’s create component named “accDisplay”

<aura:component description="accDisplay" implements="flexipage:availableForRecordHome,force:hasRecordId">
    <aura:attribute name="recordId" type="String" />
    <aura:attribute name="record" type="Object" />
    <aura:attribute name="accountRecord" type="Object" />
    
    <force:recordData recordId="{!v.recordId}"
                      targetRecord="{!v.record}"
                      targetFields="{!v.accountRecord}"
                      fields="Id, Name" mode="VIEW"/>
    
    <lightning:card iconName="standard:account" title="{!v.accountRecord.Name}" >  
        <label class="slds-form-element__label">Name: </label>
        <ui:outputText value="{!v.accountRecord.Name}"/>
        <br/> 
        <label class="slds-form-element__label">Industry: </label> 
        <lightning:formattedText title="Industry" value="{!v.accountRecord.Industry}"/> 
        <br/> 
        <label class="slds-form-element__label">Description: </label> 
        <lightning:formattedText title="Description" value="{!v.accountRecord.Description}"/>
        <br/> 
        <label class="slds-form-element__label">Phone: </label> 
        <lightning:formattedPhone title="Phone" value="{!v.accountRecord.Phone}"/>
    </lightning:card>
    
</aura:component>

Let’s create component named “accEdit”

<aura:component implements="flexipage:availableForRecordHome,force:lightningQuickActionWithoutHeader,force:hasRecordId">
    
    <aura:attribute name="account" type="Object"/>
    <aura:attribute name="accountRecord" type="Object"/>
    
    <aura:attribute name="recordSaveError" type="String" description="error message bound" />
    
    //https://github.com/jonatannietoa/salesforce-trailhead/blob/master/src/aura/accEdit/accEdit.cmp
    
    <force:recordData aura:id="accountRecordLoader"
                      recordId="{!v.recordId}"
                      layoutType="FULL"
                      targetRecord="{!v.account}"
                      targetFields="{!v.accountRecord}"
                      fields="Name,Industry,Description,Phone"
                      targetError="{!v.recordSaveError}" mode="EDIT"
                      />
    
    // Display error message
    <!-- Display Lightning Data Service errors, if any -->
    <aura:if isTrue="{!v.recordSaveError}">
        <div class="recordError">
            <ui:message title="Error" severity="error" closable="true">
                {!v.recordSaveError}
            </ui:message>
        </div>
    </aura:if>
    
    <!-- Display a header with details about the record -->
    <div class="slds-page-header" role="banner">
        <lightning:input label="Account Name" value="{!v.accountRecord.Name}" aura:id="recordName" name="accountNameRecord"/>
        <lightning:input label="Industry" value="{!v.accountRecord.Industry}" aura:id="recordIndustry" name="accountIndustryRecord"/>
        <lightning:input label="Description" value="{!v.accountRecord.Description}" aura:id="recordDesc" name="accountDescRecord"/>
        <lightning:input label="Phone" value="{!v.accountRecord.Phone}" aura:id="recordPhone" name="accountPhone"/>
    </div> 
    <lightning:button label="Save Account" onclick="{!c.handleSaveRecord}" variant="brand" class="slds-m-top--medium" />
    
    <!-- Display Lightning Data Service errors, if any -->
    <aura:if isTrue="{!v.recordSaveError}">
        <div class="recordError"> 
            {!v.recordSaveError}  
        </div>
    </aura:if> 
</aura:component>

–Controller:

({
    handleSaveRecord : function(cmp, event, helper) {
        var recordLoader = cmp.find("recordLoader");
        recordLoader.saveRecord($A.getCallback(function(saveResult) {
            if (saveResult.state === "ERROR") {
                var errMsg = "";
                alert('test');
                // saveResult.error is an array of errors,
                // so collect all errors into one message
                for (var i = 0; i < saveResult.error.length; i++) {
                    errMsg += saveResult.error[i].message + "\n";
                }
                cmp.set("v.recordSaveError", errMsg);
            } else {
                cmp.set("v.recordSaveError", "");
            }
        }));
    },
 
    handleSaveRecord2: function(component, event, helper) {
        component.set("v.editAccount.AccountId", component.get("v.recordId"));
        component.find("AccountRecordCreator").saveRecord(function(saveResult) {
            if (saveResult.state === "SUCCESS" || saveResult.state === "DRAFT") {
                // record is saved successfully
                var resultsToast = $A.get("e.force:showToast");
                resultsToast.setParams({
                    "title": "Saved",
                    "message": "The record was saved."
                });
                resultsToast.fire();
            } else if (saveResult.state === "INCOMPLETE") {
                // handle the incomplete state
                console.log("User is offline, device doesn't support drafts.");
            } else if (saveResult.state === "ERROR") {
                var errMsg = "";
                // saveResult.error is an array of errors,
                // so collect all errors into one message
                for (var i = 0;i <saveResult.error.length; i++) {
                    errMsg += saveResult.error[i].message + "\n";
                }
                cmp.set("v.recordSaveError", errMsg); 
                // handle the error state
                console.log('Problem saving contact, error: ' + JSON.stringify(saveResult.error));
            } else {
                cmp.set("v.recordSaveError", "");
                console.log('Unknown problem, state: ' + saveResult.state + ', error: ' + JSON.stringify(saveResult.error));
            }
        });
    }
})

Leave a Reply

Your email address will not be published. Required fields are marked *

*