How to redirect to the newly created record from standard 'Create a Record' quick action button ?

 How to redirect to the newly created record from standard 'Create a Record' quick action button ?

In this blog we will see how we can navigate to New Record created from Standard 'Create a Record' Quick Action. 

Implementation and Use Case: 

Use Case:

We have a button Create Contact which is a 'Create a Record' quick Action on Account object record page and on click of which when the record is created we need to navigate to the new record created automatically. 

Implementation:

Create a Record Quick Action does creates the new record but it doesn't really navigate to the create record. It only shows us the success toast message that record is created.

Now since it is standard quick action we don't have anything to update or change right to make it navigate. So, as a work around we can make this happen by creating a new empty aura component. 

In this Aura Component we will use force:showToast event to fetch the new recordId and then use force:navigateToSObject to open the new record.

Step by step approach:

Step 1 : Go to Object Manager and open the Object where you need to add the Quick Action. 

        Example :- Account Object

Step 2 : Create the Quick Action and add the fields as per the requirement.

                  Note : Keep the Success Message field blank for this use case.

Step 3 : Add it to the record page layout where needed.        

Step 4 : Create the Aura component (See code below)

Step 5 : Add the Aura Component created in step 4 anywhere on the object flexipage. 

Note : - This component is a generic so you can add it to any flexipage where navigation is needed from the standard 'Create a Record' Quick Action.

Code Snippet-

redirectToNewRecord.cmp

<aura:component implements="flexipage:availableForAllPageTypes">

    <aura:handler event="force:showToast" action="{!c.redirectToNewRecord}"/>

</aura:component>

redirectToNewRecordController.js

({

    redirectToNewRecord : function(component, event, helper) {

        var data = event.getParam('messageTemplateData');

        console.log('data => '+data);

        if(!$A.util.isEmpty(data)){

            var execComp = data[1].executionComponent;

            console.log('execComp => '+execComp);

            if(!$A.util.isEmpty(execComp)){

                console.log('execComp.attributes => '+execComp.attributes);

                var recordId = execComp.attributes.recordId;

                var navEvent = $A.get("e.force:navigateToSObject");

                navEvent.setParams({

                    "recordId": recordId,

                    "slideDevName": "related"

                });                

                navEvent.fire();

            }            

        }      

    }

})

Demo :- 

You can learn more about the events from Salesforce Documents.

Resources: Salesforce Documents. 

Thank you all! 

#Keep Learning #Keep Sharing :) 

Recent blogs-

How to use hyperlink in custom Toast Notification message in LWC

Nested Accordion in LWC

Build custom add to favorites functionality using LWC

How to update Field Level Security in bulk ?