With the winter’16 release of Salesforce Lightning, we now have a totally reinvented interface focusing on intelligent user experience. It is a component based framework that follows the MVC design pattern in which every new piece of requirement is a component. It has a promising UI, better customizing ability, and quicker access to readymade apps and components.

The advantage here is that all these components are reusable. However, one of the limitation of JavaScript is that the JS of one component cannot communicate with the JS of another component.

How can these components talk with each other? This is where Events comes into the picture. In simple terms, Lightning Events are the bridge to this communication. This blog talks about the Salesforce Lightning Framework Events and when and where to use each events.

Salesforce Lightning Events are broadly classified into four:

  1. System Events
  2. Lightning Application Events from library
  3. Application Events
  4. Component Events

SYSTEM EVENTS

System events are fired automatically by lightning framework and during component initialization, rendering or attribute value change etc. The different types of Lightning supported system events are:

  1. aura:valueInit – executes a logic when the component markup is initiated or loaded but the component page is not yet rendered. This is the first system event that gets fired.
  2. aura:valueRender – executes a logic when the component page is rendered completely or re-rendered
  3. aura:noAccess – executes a logic when the requested resource has no access permission
  4. aura:locationChange – executes a logic when the URL hash part has been changed
  5. aura:systemError – executes a logic when error occurs during the execution of server-side (apex controller) action.
  6. aura:valueChange – executes a logic when the aura attribute value is changed
  7. aura:valueDestroy – executes a logic when the component is destroyed and we want to do some custom cleanup during that period.

 System events are easy to handle and If you want to perform a logic during the occurrence of any of these events mentioned above, you can handle it in your HTML markup code by adding the below code:

<aura:handler name=”name_of_the_event” value=”{!this}” action=”{!c.handleSystemEvent}”/>

NB: name_of_the_event” can be init, render, destroy, change, aura:systemError

Now you can write the logic that you want to perform in the JS controller using the below syntax:

({
    handleSystemEvent: function (component, event, helper) {
      //Do your logic
    }
})

LIGHTNING APPLICATION EVENTS FROM LIBRARY 

These events are provided by Salesforce Library that can be often used based on your requirement. However, some of these library events might not be supported in Salesforce app and Lightning Experience or a standalone app all at the same time. So it is recommended to instantiate the event using $A.get() to determine from where your component is running i.e Salesforce app and Lightning Experience or a standalone app.

createRecord: function (component, event, helper) {
    var createRecordEvent= $A.get(“e.force:createRecord”); //event taken from library
    if (createRecordEvent){
        // means if the event is supported

       //fire the create Record event in Salesforce app and Lightning Experience
        createRecordEvent.setParams({
          “entityApiName”: “Contact”

        });
        createRecordEvent.fire();
    } else {

        //if event is not supported
        //your record creation implementation for a standalone app here
    }
}

Refer the link below to know the different types of events supported by Salesforce Lightning library:

https://developer.salesforce.com/docs/atlas.en-us.lightning.meta/lightning/events_one.htm

APPLICATION EVENTS 

Application Events helps in passing values between two independent events (without parent child relationship). It behaves just like a broadcast message wherein any device that has the receiver turned on can receive the broadcast message sent from a single device. It means that in case of Application Events, any component with the handler statement defined for the event can receive the fired event.

COMPONENT EVENTS 

Component Events are required in order to pass values from child component to parent. Parent component (receiver) will be handling the event fired by the child components (sender).

Read more: A Guide to Application & Component Events in Salesforce Lightning   

 

05 Feb 2019
Author : Mehrin Sherif