+ Start a Discussion
Gaurav Jain 7Gaurav Jain 7 

Lightning Data Service Basics - Handle Record Changes and Errors

Hi,

I an getting below error:

Challenge Not yet complete... here's what's wrong: 
The 'accEdit' Lightning Component does not appear to be checking if 'v.recordSaveError' is true.

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

<aura:attribute name="record" type="Object" />
<aura:attribute name="accountRecord" type="Object" />
<aura:attribute name="recordSaveError" type="String" />

<force:recordData aura:id="recordEditor"
    layoutType="FULL"
    recordId="{!v.recordId}"
    targetError="{!v.recordSaveError}"
    targetRecord="{!v.record}"
    targetFields ="{!v.accountRecord}"
        fields="Name"          
    mode="EDIT" />

    <!-- Display a lightning card with details about the record -->
    <div class="Record Details"> 
        <lightning:card iconName="standard:account" title="{!v.accountRecord.Name}" >
            <div class="slds-p-horizontal--small">
                <p class="slds-text-heading--small">
                    <lightning:formattedText title="Billing State" value="{!v.accountRecord.BillingState}" /></p>
                <p class="slds-text-heading--small">
                     <lightning:formattedText title="Billing City" value="{!v.accountRecord.BillingCity}" /></p>
            </div>
        </lightning:card>
    </div>
    <br/>

    <!-- Display an editing form -->
    <div class="Record Details">
        <lightning:card iconName="action:edit" title="Edit Account">
            <div class="slds-p-horizontal--small">
                <lightning:input label="Account Name" value="{!v.accountRecord.Name}"/>
                <br/>
                <lightning:button label="Save Account" variant="brand" onclick="{!c.handleSaveRecord}" />
            </div>
        </lightning:card>
    </div>


    <aura:if isTrue="{!not(empty(v.recordSaveError))}">
		<br />

        Error: <ui:outputText value="{!v.recordSaveError}"/>

    </aura:if>
</aura:component>


accEditcontroller.js
({
    handleSaveRecord: function(cmp, event, helper) {
        cmp.find("recordEditor").saveRecord($A.getCallback(function(saveResult) {
            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);
            } else {
                cmp.set("v.recordSaveError", "");
            }
        }));}
})

 
Rahul KumarRahul Kumar (Salesforce Developers) 
Hi Gaurav Jain,

May I suggest you please refer the below link for reference. Let us know if it helps.

Please mark it as best answer if the information is informative.so that question is removed from an unanswered question and appear as a proper solution.

Thanks
Rahul Kumar
sfdcMonkey.comsfdcMonkey.com
hi gaurav,
try to give a default value attribute  to your aura attribute such as :
 
<aura:attribute name="recordSaveError" type="String" default=""/>
i hope it helps you.
 Let me inform if it helps you and kindly mark it best answer if it helps you so it make proper solution for others
thanks 
sfdcmonkey.com
Gaurav Jain 7Gaurav Jain 7
Hi Piyush,

I tried this but it is not working
Gaurav Jain 7Gaurav Jain 7
Hi Piyush,

No Success, please find the below code as per your instruction:

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

<aura:attribute name="record" type="Object" />
<aura:attribute name="accountRecord" type="Object" />
<aura:attribute name="recordSaveError" type="String" default="" />

<force:recordData aura:id="recordEditor"
    layoutType="FULL"
    recordId="{!v.recordId}"
    targetError="{!v.recordSaveError}"
    targetRecord="{!v.record}"
    targetFields="{!v.accountRecord}"
        fields="Name"          
    mode="EDIT" />

    <!-- Display a lightning card with details about the record -->
    <div class="Record Details"> 
        <lightning:card iconName="standard:account" title="{!v.accountRecord.Name}" >
            <div class="slds-p-horizontal--small">
                <p class="slds-text-heading--small">
                    <lightning:formattedText title="Billing State" value="{!v.accountRecord.BillingState}" /></p>
                <p class="slds-text-heading--small">
                     <lightning:formattedText title="Billing City" value="{!v.accountRecord.BillingCity}" /></p>
            </div>
        </lightning:card>
    </div>
    <br/>

    <!-- Display an editing form -->
    <div class="Record Details">
        <lightning:card iconName="action:edit" title="Edit Account">
            <div class="slds-p-horizontal--small">
                <lightning:input label="Account Name" value="{!v.accountRecord.Name}"/>
                <br/>
                <lightning:button label="Save Account" variant="brand" onclick="{!c.handleSaveRecord}" />
            </div>
        </lightning:card>
    </div>

   <!-- Display error message -->
<aura:if isTrue="{!not(empty(v.recordSaveError))}">
<div class="recordSaveError">
  Error: <ui:outputText value="{!v.recordSaveError}"/>
</div>
</aura:if>
    
    
</aura:component>

accEditcontroller.js
 
({
    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") {
                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);
            } else{
                 component.set("v.recordSaveError", "");
                 console.log('Unknown problem, state: ' + saveResult.state + ', error: ' + JSON.stringify(saveResult.error));
                }
        }));
    }
})



 
Misbah ul ImanMisbah ul Iman
I am having the Same error. Did you got any luck with fixing it. My Component is working fine

User-added image

ACCEdit Code
 
<aura:component implements="force:hasRecordId,flexipage:availableForRecordHome">
    
    <aura:attribute name="accountRecord" type="Object"/>
    <aura:attribute name="recordSaveError" type="String" default=""/>
    
    <force:recordData aura:id="recordLoader"
        recordId="{!v.recordId}"
        fields="Name"
        targetFields="{!v.accountRecord}"
        targetError="{!v.recordSaveError}"
        mode="EDIT" 
         />

    <!-- Display Lightning Data Service errors, if any -->
    <aura:if isTrue="{!not(empty(v.recordSaveError))}">
        <div class="recordError">
            <ui:message title="Error" severity="error" closable="true">
                {!v.recordSaveError}
            </ui:message>
        </div>
    </aura:if>

	<div class="Record Details">
        <lightning:card iconName="action:edit" title="Edit Account">
            <div class="slds-p-horizontal--small">
                <lightning:input label="Account Name" value="{!v.accountRecord.Name}"/>
                <br/>
                <lightning:button label="Save Account" variant="brand" onclick="{!c.handleSaveRecord}" />
            </div>
        </lightning:card>
    </div>
</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 = "";
                // 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", "");
            }
        }));
    }
})

Any any one please assist. What is wrong. 
Tim Bott 8Tim Bott 8
The validation function may be malfunctioning on this one.  This same code valides fine in one of my playground orgs; but fails in a different playground org.  
Misbah ul ImanMisbah ul Iman
Same code worked in other Org. It was very strange, i spent 3 hours just banging my head why code is not validating.
Halim BOUNFOUF 6Halim BOUNFOUF 6
Hi,
Replace 
<aura:if isTrue="{!not(empty(v.recordSaveError))}">
with
<aura:if isTrue="{! v.recordSaveError}">