I am trying to override the standard button on the related list of Quote object using a lightning component [compA]. For some reason, the record id is undefined even if I have force:recordId and an attribute. I would need the recordId to prepopulate a field on my lightning component form and for redirection after the user hits save button. I created another lightning component that displays the record Id and placed it on the Quote record page just for testing and it successfully displays the id. Is there a way for me to get the record Id on my lightning component [compA]?
1 Answer
You'll have to pass the record Id to your aura component to have it.
Why?
When your component is invoked in a record context in Lightning Experience or the Salesforce mobile app, the recordId is set to the ID of the record being viewed.
Clicking the "new" button on a related list opens a new page context (it'll be in its own tab) - in this case, it opens the Aura component away from the record (Quote). It no longer has the context of a record page and that is why you have no record Id.
Your test (LWC on Quote record page), which has a record context, and your situation (button on related list that opens new tab) are not the same conditions - hence, why you get different results.
You'd have to leverage a URL button (List Button) on the related list for this to work in that capacity. On the related list, you'd show your custom button and and hide the standard new button.
To do the URL part, you need to leverage IsUrlAddressable so you can use a link to call your Aura component with values - so you'll pass the record Id before it re-directs to your URL from the related list.
Your URL will be /lightning/cmp/c__componentname?c__quoteId={!Quote.Id}
<!--
make sure to implement it to be url addressable
as well as available for all page types
-->
<aura:component implements="lightning:isUrlAddressable,flexipage:availableForAllPageTypes">
<aura:attribute name="quoteId" type="String" />
<!-- Add an "init" handler to handle the first "v.pageReference" value -->
<aura:handler name="init" value="{!this}" action="{!c.onPageReferenceChange}"/>
<!-- Add a "change" handler to handle all changes to the "v.pageReference" value -->
<aura:handler name="change" value="{!v.pageReference}" action="{!c.onPageReferenceChange}"/>
({
onPageReferenceChange: function(cmp, evt, helper) {
var myPageRef = cmp.get("v.pageReference");
var quoteId = myPageRef.state.c__quoteId;
cmp.set("v.quoteId", quoteId);
}
})
-
Hi @Kris thank you for your answer! I tried the approach above but whenever my button is clicked, I am being redirected to a page with "This page isn't available in Salesforce Lightning Experience or mobile app". Though I am seeing in the url that it has the correct account Id. Any idea what could went wrong?– CharlieMar 24, 2022 at 14:22
-
Did you implement isUrlAddressable on the aura component?
<aura:component implements="lightning:isUrlAddressable">
Mar 24, 2022 at 14:24 -
-
apologies, I edited the answer. You just need to implement
flexipage:availableForAllPageTypes
as well. Mar 24, 2022 at 15:14