function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
NerdyNerdy 

implement the "Next Step" Button on a lightning Form

Hello, 

Can you help me to achieve this 

I have two lightning components of the same form
How can i implement  handleClick function so that when ther user cliks on NEXT Step Button in the first component it moves to the second component

Here is my button 
<lightning:button class="sw-btn sw-btn-orange" label="NEXT STEP" variant ="brand" title="Next Step" onclick="{! c.handleClick }"



 
Khan AnasKhan Anas (Salesforce Developers) 
Hi,

Greetings to you!

You can use lightning:navigation. Below is the sample code which I have tested in my org and it is working fine. Kindly modify the code as per your requirement.

Component: 
<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction,lightning:isUrlAddressable" access="global" >
    
    <aura:attribute name="url" type="String"/>
    <aura:attribute name="pageReference" type="Object"/>
    
    <aura:handler name="init" value="{! this }" action="{! c.init }"/>
    
    <lightning:navigation aura:id="navService"/>
    <lightning:button class="sw-btn sw-btn-orange" label="NEXT STEP" variant ="brand" title="Next Step" onclick="{! c.handleClick }"
</aura:component>

Controller: 
({
    init : function(cmp, event, helper) {
    },
    
    handleClick : function(component, event, helper) {
        var navService = component.find("navService");
        var pageReference = {
            "type": "standard__component",
            "attributes": {
                "componentName": "c__Insert_Task1"  // c__YourComponentName
            }
        }
        
        navService.navigate(pageReference);
    }   
})

Don't forget to implement lightning:isUrlAddressable in both the component.

I hope it helps you.

Kindly let me know if it helps you and close your query by marking it as solved so that it can help others in the future. It will help to keep this community clean.

Thanks and Regards,
Khan Anas​​​​​​​