application event in aura lightning -- w3web.net

How to pass data from parent component to child component Using Application event in salesforce | How to Use Application Event to pass attribute value from one lightning component to another in aura lightning component Salesforce

136 views

Hey guys, today in this post we are going to learn about How to Use Application Event to pass attribute value from one lightning component to another in aura lightning component Salesforce.

Event-driven programming is used in many languages and frameworks, such as JavaScript and Java Swing. The idea is that you write handlers that respond to interface events as they occur.

A component registers that it may fire an event in its markup. Events are fired from JavaScript controller actions that are typically triggered by a user interacting with the user interface.

There are two types of events in the framework:

  • Component events are handled by the component itself or a component that instantiates or contains the component.
  • Application events are handled by all components that are listening to the event. These events are essentially a traditional publish-subscribe model. To know more details about Events, Clcick Here.

 

Files we used to Application event in Lightning Component →

appEventCmp.cmp Lightning Component It is used to click function to display record based on record Id.
appEventCmpController.js JavaScript Controller It is hold Javascript findAccDetail fnction to connect javascript controller to helper function.
appEventCmpHelper.js JavaScript Controller Helper It is hold Javascript recordAccData function to get the record based on record Id and pass the attribute event value.
AccountDetailsCmp.cmp Lightning Component It is child component and iterating data from salesforce object.
AccountDetailsCmpController.js JavaScript Controller It is hold Javascript storeEventData fnction to connect javascript helper function.
AccountDetailsCmpHelper.js JavaScript Controller Helper It is hold Javascript storeEventData fnction and get event value that is coming from parent component.
accountEventCtrl.apxc Apex Class Controller It is used to get Account Record based on Record Id in Apex Method.
myAppEvent.evt Lightning Event It is used to store the attributes value and pass from parent to child component through javascript register/handler Event in component.

 

Final Output →

application event in aura lightning -- w3web.net

 

Other related post that would you like to learn in Salesforce

 

  • Find the below steps ▾

 

Create Lightning Component

Step 1:- Create Lightning Component : appEventCmp.cmp

From Developer Console >> File >> New >> Lightning Component

appEventCmp.cmp [Lightning Component File]

 

Create JavaScript Controller

Step 2:- Create Lightning Component : appEventCmpController.js

From Developer Console >> File >> New >> Lightning Component >> JavaScript Controller

appEventCmpController.js [JavaScript Controller]

 

Create JavaScript Helper

Step 3:- Create Lightning Component : appEventCmpHelper.js

From Developer Console >> File >> New >> Lightning Component >> JavaScript Helper

appEventCmpHelper.js [JavaScript Helper File]

 

Create Lightning Component

Step 4:- Create Lightning Component : AccountDetailsCmp.cmp

From Developer Console >> File >> New >> Lightning Component

AccountDetailsCmp.cmp [Lightning Component File]

 

Create JavaScript Controller

Step 5:- Create Lightning Component : AccountDetailsCmpController.js

From Developer Console >> File >> New >> Lightning Component >> JavaScript Controller

AccountDetailsCmpController.js [JavaScript Controller]

 

Create JavaScript Helper

Step 6:- Create Lightning Component : AccountDetailsCmpHelper.js

From Developer Console >> File >> New >> Lightning Component >> JavaScript Helper

AccountDetailsCmpHelper.js [JavaScript Helper File]

 

Create Lightning Event

Step 7:- Create Lightning Event : myAppEvent.evt

From Developer Console >> File >> New >> Lightning Event

myAppEvent.evt [Lightning Event File]

 

Create Apex Class Controller

Step 8:- Create Apex Class : accountEventCtrl.apxc

From Developer Console >> File >> New >> Apex Class

accountEventCtrl.apxc [Apex Class Controller]

 

Further post that would you like to learn in Salesforce

 

FAQ (Frequently Asked Questions)

What is event propagation in Aura component?

What is event propagation in Aura component? Image result for event propagation in aura Event propagation determines how you communicate in your application. The event propagation rules determine which components in the containment hierarchy can handle events in the bubble or capture phase. The framework supports capture and bubble phases for component event propagation.

How do you stop event propagation in Aura component?

Any handling event can stop propagation by calling stopPropagation() on the event. Bubble phase :-The framework executes the bubble phase from the source component to the application root until all components are traversed or stopPropagation() is called.

What are the three phases of event propagation in JS?

There are three different phases during lifecycle of an JavaScript event. They follow the same order as listed above. Capturing Phase is when event goes down to the element. Target phase is when event reach the element and Bubbling phase is when the event bubbles up from the element.

Related Topics | You May Also Like

  • Your reaction of the article ▾
 

Hi, This is Vijay Kumar behind the admin and founder of w3web.net. I am a senior software developer and working in MNC company from more than 8 years. I am great fan of technology, configuration, customization & development. Apart of this, I love to write about Blogging in spare time, Working on Mobile & Web application development, Salesforce lightning, Salesforce LWC and Salesforce Integration development in full time. [Read full bio] | | The Sitemap where you can find all published post on w3web.net

Leave a Comment