I have to open a lightning component from a button on related list. Hence I created a list button in child object and added it on the page layout of parent object.

I created a list button with URL as below


Commercial_Opportunity_Product is the name of my lightning component. I have passed firstName as parameter. Below is the code of Commercial_Opportunity_Product component.

<aura:component implements="lightning:actionOverride,lightning:isUrlAddressable,force:lightningQuickActionWithoutHeader,force:hasRecordId,flexipage:availableForAllPageTypes">
<aura:attribute name="recordId" type="String"/>
<aura:attribute name="parentId" type="String"/>
<aura:attribute name="firstName" type="String"/>
<aura:handler name="init" value="{!this}" action="{!c.onPageReferenceChange}"/>
<div class="slds-modal slds-fade-in-open">
    <div class="slds-modal__container">
        <div class="slds-modal__content slds-p-around--medium">
                <header class="slds-modal__header">
                    <h2 class="slds-modal__title">New Commercial Opportunity Product</h2>
                    <p> Hello {!v.firstName}</p>
                <div class="slds-p-vertical_small slds-text-body_medium">
                    <lightning:recordEditForm aura:id="form"
                        <h2 class="slds-section-title--divider">Information</h2>
                        <div class="slds-grid slds-gutters">
                            <div class="slds-col ">
                                <lightning:inputField fieldName="GEFUE_Terminal__c" aura:id="terminalLookupId"/>
                                <lightning:inputField fieldName="GEFUE_Product__c" aura:id="productLookupId"/>
                            <div class="slds-col">
                                <lightning:inputField fieldName="GEFUE_Opportunity__c" aura:id="oppLookupId"/>

Below is code of its controller

    onPageReferenceChange : function(component, event, helper) {
        var myPageRef = component.get("v.pageReference");
        var firstname = myPageRef.state.c__firstName;
        component.set("v.firstName", firstname);

But when opening this component via the URL button in related list, it is taking me to another page and giving below error.

This page isn't available in Salesforce Lightning Experience or mobile app.

Below is the screenshot

enter image description here

Am I missing something here? I have also implemented lightining:isUrlAddressable for launching lightning component via a URL.

2 Answers 2


You are missing page Reference in controller , refer this link :

Navigation Example component link


You can use this playground to generate the URL to navigate to the lightning web component via the related list:-

enter image description here

In your case, using lightning:navigation will not work as you have to invoke it through a related list button which does not support Lightning Component button.

Note:- This is not a documented way to do, but works.

  • What if firstName is dynamic? Or How to pass parameters as well in the URL?
    – user61140
    Mar 27, 2021 at 17:17

You must log in to answer this question.

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