0

From the Manipulate Records with force:recordData module https://trailhead.salesforce.com/modules/lightning_data_service/units/lightning_data_service_manipulate_records, I passed the challenge using the below component for editing the name of an account record. However when applying it to records page of Account and trying to edit the Name of the account I get an error.

Component

<aura:component implements="flexipage:availableForAllPageTypes,force:hasRecordId">
<aura:attribute name="accountRecord" type="Object"/>    
<aura:attribute name="simpleNewAccount" type="Object"/>
<aura:attribute name="newAccountError" type="String"/>

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

<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 Lightning Data Service errors, if any -->
 <aura:if isTrue="{!not(empty(v.recordError))}">
    <div class="recordError">
    {!v.recordError}
    </div>
 </aura:if> 
</aura:component>

Controller:

({
    handleSaveRecord : function(component, event, helper) {
        component.find("AccountRecordEdit").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") {
                JSON.stringify(saveResult.error));
            }else {
                console.log('Unknown problem, state: ' + saveResult.state + ', error: ' + 
                JSON.stringify(saveResult.error));
            }

        }
    }
})

I used the component in a records page. I created a new records page for Account object using Lightning App Builder.

enter image description here

When I try to select an account to see the record page I created:

enter image description here

enter image description here

I now try to type in a name in the field. It shows up below error. What I may be missing here? I tried accessing the Name of the account like - <lightning:input label="Account Name" value="{!v.accountRecord.Fields.Name.Value}"/> but resulted in the same error.

enter image description here

7
  • Is recordId getting? you are not defined any attribute named accountRecordId. It seems you missing in this part ` recordId="{!v.accountRecordId}"` . – vignesh Nov 29 '17 at 17:56
  • The example shown in trailhead does not use recordid explicitly. I was assuming the ID part is added at the end of the attribute name. Are you suggesting to create an attribute of type ID? – SfdcBat Nov 29 '17 at 18:09
  • where you placing your component recordpage or app page or an standalone app. – vignesh Nov 29 '17 at 18:12
  • I added in the record page. Like this - trailhead.salesforce.com/modules/lightning_app_builder/units/… – SfdcBat Nov 29 '17 at 18:14
  • you are placing your component in record page force:hasRecordid automatically inherits the record Id attribute no need to explicitly define use ` recordId="{!v.recordId}"` ` not ` recordId="{!v.accountRecordId}"` – vignesh Nov 29 '17 at 18:16
1

1.whenever Target record is used syntax is bit diffrenet rather than targetFields you want to use like this {!v.accountRecord.fields.Name.value} because you acccessing via Fields schema.

2.you are placing your component in record page force:hasRecordid automatically inherits the record Id attribute no need to explicitly define use recordId="{!v.recordId}" not recordId="{!v.accountRecordId}"

Example :

Component:

<aura:component implements="flexipage:availableForAllPageTypes,force:hasRecordId">
<aura:attribute name="accountRecord" type="Object"/>    
<aura:attribute name="simpleNewAccount" type="Object"/>
<aura:attribute name="newAccountError" type="String"/>

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

<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.fields.Name.value}"/>
        <br/>
        <lightning:button label="Save Account" variant="brand" onclick="{!c.handleSaveRecord}" />
     </div>
    </lightning:card>
</div>

<!-- Display Lightning Data Service errors, if any -->
 <aura:if isTrue="{!not(empty(v.recordError))}">
    <div class="recordError">
    {!v.recordError}
    </div>
 </aura:if> 
</aura:component>
1
  • Thanks. Please also post your controller when you get a chance. The one question has syntax errors( used from trailhead example). – SfdcBat Nov 29 '17 at 20:03
0

The controller in the question has some syntax errors. Use the below controller:

({ 
    handleSaveRecord : function(component, event, helper) { 
        component.find("AccountRecordEdit").saveRecord($A.getCallback(function(saveResult) { 
            if (saveResult.state === "SUCCESS" || saveResult.state === "DRAFT") { 
                console.log("Before success message");
                component.set("v.message","Success");
                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") { 
                JSON.stringify(saveResult.error); 
            }else { 
                JSON.stringify(saveResult.error); 
            } 
        })) 
    } 
})

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.