function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
bharath kumar 52bharath kumar 52 

Open a tab from instead of modal in lightning component quick action

Hi All,

I am working on a requirement where i am supposed to display a lightning component embedded in a quick action in a "new tab" instead of a modal popup. The component that i have embedded in the quick action takes the opportunity id as a input and based on a button click i will be saving some child records related to it.
I have tried this link too but it doesn't work https://salesforce.stackexchange.com/questions/158244/how-to-open-lightning-component-tab-from-lightning-quick-action-instead-of-light
Assuming that the code is something like below 

Component :
<aura:component 
    implements="force:appHostable, flexipage:availableForAllPageTypes, flexipage:availableForRecordHome, force:hasRecordId, forceCommunity:availableForAllPageTypes, force:lightningQuickAction">
    <aura:handler name="init" action="{!c.navigateToeDiscoverySearchCmp}" value="{!this}" />
    <aura:attribute name="recordId" type="Id" />
</aura:component>

Controller js :
({
    navigateToeDiscoverySearchCmp : function(component, event, helper) {
        var evt = $A.get("e.force:navigateToComponent");
        evt.setParams({
            componentDef : "c:TestOppAdj",
            recordId: component.get("v.recordId") // this value is not getting set
        });
        evt.fire();
    } 
})
Because the recordId is not getting set i am getting the below issue  else the tables in the below pic would be populated

User-added imageAlso, i am getting something like this in the url /one/one.app#eyJjb21wb25lbnREZWYiOiJjOlRlc3RPcHBBZGoiLCJhdHRyaWJ1dGVzIjp7fSwic3RhdGUiOnt9fQ%3D%3D and not the id .

Can someone tell me where i am going wrong or help me deal with this issue?

Thanks,
Bharath

Best Answer chosen by bharath kumar 52
David Zhu 🔥David Zhu 🔥
When you say you get the id in console, I assume you meant Console of the browser.

You don't have to implement force:hasRecordID at all in testappajd component.
You may add this two lines in testappadj.

<aura:attribute name="passedRecordId" type="String" />
passed record Id: {!v.passedRecordId} 


In lighting action component, pass two parameters
({
    navigateToeDiscoverySearchCmp : function(component, event, helper) {
        var evt = $A.get("e.force:navigateToComponent");
        evt.setParams({
            componentDef : "c:TestOppAdj",
            componentAttributes: {
                recordId : component.get("v.recordId"),
                passedRecordId : component.get("v.recordId")
            }
        });
        evt.fire();
    } 
})

You should see a value printed for passed record id.
 

All Answers

David Zhu 🔥David Zhu 🔥
You may change the way how to pass the parameter to make it work.

({
    navigateToeDiscoverySearchCmp : function(component, event, helper) {
        var evt = $A.get("e.force:navigateToComponent");
        evt.setParams({
            componentDef : "c:TestOppAdj",
            componentAttributes: {
                recordId : component.get("v.recordId")
            }

        });
        evt.fire();
    } 
})
 
bharath kumar 52bharath kumar 52

Hi David,

Thanks, but i tried that too and still the issue persists. Just to let you know i am getting the id in the console but im not sure why it isnt getting passed to the component.

David Zhu 🔥David Zhu 🔥
Can you check if you have this line on TestOppAdj lighting component? recordId is case sensative.
<aura:attribute name="recordId" type="String" />

and you can just put 
record Id: {!v.recordId} on TestAppAdj componet html to check the result.
bharath kumar 52bharath kumar 52
Yes, i have an attribute with the exact name "recordId" of type Id in that component. Also TestAppAdj component and it also used implements force:hasRecordId.
David Zhu 🔥David Zhu 🔥
When you say you get the id in console, I assume you meant Console of the browser.

You don't have to implement force:hasRecordID at all in testappajd component.
You may add this two lines in testappadj.

<aura:attribute name="passedRecordId" type="String" />
passed record Id: {!v.passedRecordId} 


In lighting action component, pass two parameters
({
    navigateToeDiscoverySearchCmp : function(component, event, helper) {
        var evt = $A.get("e.force:navigateToComponent");
        evt.setParams({
            componentDef : "c:TestOppAdj",
            componentAttributes: {
                recordId : component.get("v.recordId"),
                passedRecordId : component.get("v.recordId")
            }
        });
        evt.fire();
    } 
})

You should see a value printed for passed record id.
 
This was selected as the best answer