1

I've tried using the Id from a lookup field involving the record being view in my lightning component. I query this data in init, then set the returned value to theCase.

<aura:component implements="flexipage:availableForRecordHome,force:hasRecordId,force:hasSObjectName" access="global" controller="PaymentInfoController">

    <aura:handler name="init" action="{!c.doInit}" value="{!this}"/>
    <aura:attribute name="theCase" type="Case" />    

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

    // The_Contact__c is a lookup field
    <force:recordData aura:id="contactEditor"
      recordId="{!v.theCase.The_Contact__c}"
      targetError="{!v.recordError}"
      targetRecord="{!v.record}"
      fields="Email"
      layoutType="Full"
      mode="EDIT"
     />

     <lightning:input title="Patient Email" 
                      value="{!v.record.Email}" />

     <lightning:button variant="brand" 
                       label="Update Email" 
                       onclick="{!c.handleContactUpdated}"/>

When I click the lightning:button, it does console.log a Contact.Id. But when I type in the lightning:input box, I get this error: enter image description here

Everything I've seen in the docs shows them using the value given from force:hasRecordId, so it appears to me the only way to use Lightning Data Service.

1 Answer 1

2

No, you don't need to use the Id from force:hasRecordId, that just happens to be the example the documentation uses. I once answered a question about the efficiency of using Lightning Data Service, and did so using an inner component that loaded the records; they were initialized from a query.

However, in your specific case, the problem is that force:recordData had already been initialized to a null record (it's initialized when it loads during aura:valueInit). The example in the documentation already has the recordId when force:recordData initializes, so it doesn't need to call reloadRecord.

In your controller, you need to make sure that you tell the component to re-initialize:

init: function(component, event, helper) {
  var action = component.get("c.initialize");
  action.setParams({ recordId: component.get("v.recordId") });
  action.setCallback(this, function(response) {
    var contactEditor = component.find("contactEditor");
    component.set("v.theCase", response.getReturnValue());
    setTimeout($A.getCallback(function() { contactEditor.reloadRecord() }));
  });
  $A.enqueueAction(action);
}

reloadRecord causes the data to be initialized correctly. You need to do this or you'll have a bad time. Note that I used an extra asynchronous call via setTimeout to give the system a chance to trigger any extra aura:valueChange triggers that may occur as a result. This may not be necessary in your case.


Example from my org:

<aura:application controller="q221617" extends="force:slds">
    <aura:attribute name="recordId" type="Id" />
    <aura:attribute name="contact" type="Contact" default="{}" />

    <aura:handler name="init" value="{!this}" action="{!c.init}" />

    <force:recordData aura:id="rd"
                      recordId="{!v.recordId}"
                      fields="Email"
                      mode="EDIT"
                      targetFields="{!v.contact}" />
    <lightning:input label="Email"
                     value="{!v.contact.Email}" />

</aura:application>

({
    init: function(component, event, helper) {
        var action = component.get("c.getRecord");
        action.setCallback(this, function(result) {
            component.set("v.recordId", result.getReturnValue().Id);
            setTimeout($A.getCallback(function() { 
                component.find("rd").reloadRecord();
            }),100);
        });
        $A.enqueueAction(action);
    }
})
7
  • Doesn't appear to work :( Every time I try to enter a value in my input field, that same error modal appears from my original post.
    – Tyler Zika
    Jun 15, 2018 at 3:26
  • when I use console.log(component.find("contactEditor").get("v.recordId")); in my onclick function, it does return the Contact.Id, so that is a good sign.
    – Tyler Zika
    Jun 15, 2018 at 3:44
  • @sfdx that error model is still appearing, even after after updating my code with the new method. Why do you think that is? I'm using a Service Console app with my lightning component.
    – Tyler Zika
    Jun 15, 2018 at 3:48
  • @TylerZika I've added the code that works in my org; this is an application, but no reason why it shouldn't work in a console or otherwise. Also, remember you may need to refresh twice since LEX caches components.
    – sfdcfox
    Jun 15, 2018 at 3:50
  • quality answers as usual @sfdcfox! My problem was accessing the id via relationship, {!v.theCase.The_Contact__c}, but changing the value of {!v.recordId} after init did the trick.
    – Tyler Zika
    Jun 15, 2018 at 4:13

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .