Here is the order in which the component events are propagated:
- Event triggered – A component event is triggered.
- Capture phase —The framework executes the capture phase from the application root to the source component until all components have been passed. …
- Bubble phase —The framework executes the bubble phase from the source component to the application root until all components have been passed or stopPropagation () is called.
Table of Contents
What is the capture phase of event propagation in Salesforce?
In this, the Event is first captured and handled by the source component and then propagated by application root. In this, the Event is first captured by application root and then propagated by source component. The capture phase is also known as trickling, Which recollects the propagation order.
What are application events and component events in Salesforce Lightning?
Application events and component events are the two types of Salesforce Lightning events that are used to communicate and transfer data between two components. What Is Component Event Propagation? Event propagation determines how you communicate in your application.
What are the phases of component event propagation?
Component event propagation have two phases. In the below example we are firing event from BottomComp and handling it in MiddleComp, MiddlleComp2 and TopComp so let us see the behavior. Note: Movement of the bubble phase is from bottom to top.
How to stop propagation in Salesforce?
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.
Which two are the phases in the Salesforce?
The framework supports capture and bubble phases for component event propagation. These phases are equivalent to DOM handling patterns and allow interested components to interact with an event and potentially control subsequent handlers’ behavior. The capture phase is carried out before the bubble phase.
What is event propagation in Salesforce?
The framework supports capture and bubble phases for the propagation of component events. These phases are similar to DOM handling patterns and provide an opportunity for interested components to interact with an event and potentially control the behavior for subsequent handlers.
How many types of events are there in Salesforce?
There are two types for events: Component Event. Application Event.
What is bubble phase and capture phase?
Capturing phase – the event goes down to the element. Target phase – the event reached the target element. Bubbling phase – the event bubbles up from the element.
What is bubble phase in lightning?
Bubble Phase (Default): The handlers specified on each component are fired in this order i.e. from source to the owner. This phase where the event is handled from innermost to the outermost component is called the bubble phase.It is also the default phase in lightning.
What are the different types of events of Salesforce lightning components?
Salesforce Lightning Events are broadly classified into four:System Events.Lightning Application Events from library.Application Events.Component Events.
Which two are phases in Aura application event propagation framework?
The framework supports capture , bubble , and default phases for the propagation of application events. The capture and bubble phases are similar to DOM handling patterns and provide an opportunity for interested components to interact with an event and potentially control the behavior for subsequent handlers.
What are event types in Salesforce?
These event types provide more granular visibility in user behavior on Lightning by separating user data into four distinct categories: Lightning Errors, Interactions, Page Views, and Performance.
What are the steps for an event in lightning?
Component Event in Lightning Component | Lightning Component Communication With EVENT | aura:event Create Event Component. Register the Event ( in Child Component ) Fire the Event ( from Child Component) Handle the Event (In Parent Event)
What is the bubble phase?
A bubble phase, consisting of (almost) solid-free gas bubbles rising through the bed, and a dense (or particulate or emulsion) phase where the bed particles are suspended by an interstitial gas flow, whose velocity is close to the minimum for fluidization.
What is event bubbling and capturing?
Event capturing means propagation of event is done from ancestor elements to child element in the DOM while event bubbling means propagation is done from child element to ancestor elements in the DOM.
What is meant by event bubbling?
Event bubbling is a type of event propagation where the event first triggers on the innermost target element, and then successively triggers on the ancestors (parents) of the target element in the same nesting hierarchy till it reaches the outermost DOM element or document object (Provided the handler is initialized).
What is the component that fires an event?
The component that fires an event is known as the source component . The framework allows you to handle the event in different phases. These phases give you flexibility for how to best process the event for your application. The phases are: Capture.
How do event handlers work?
Event handlers are invoked in order from the application root down to the source component that fired the event. Any registered handler in this phase can stop the event from propagating, at which point no more handlers are called in this phase or the bubble phase. The component that fired the event can handle it.
What is an event in Salesforce?
An event is a notification that makes an interested entity discover that something has happened and can now take the appropriate action. The interested entity is defined as the components that you create in Salesforce Lightning. The components will register for the events they are interested in and trigger it if necessary.
What is event propagation phase?
Depending on the type of phase, events can be handled starting from the innermost or outermost container. Frames allow you to process events in different phases. In these phases, you have the flexibility to decide how effectively you can handle the event for your application.
What is Salesforce Lightning?
Salesforce Lightning, known as the future of Salesforce, comprises the no. innovative tools and technologies that bring several upgrades for enhancing the Salesforce1 Platform. It consists of the Lightning Component Framework, which can be used to create reusable components, customize Salesforce1 applications, and build standalone applications.
What are the propagation rules for component events?
1.Event Propagation rules for the component events: Component events are fired by the child components and processed by the parent component. MiddleComp is the immediate parent of BottomComp, and TopComp is the immediate parent of MiddleComp and MiddleComp2. 2) Bubble phase: If we do not specify any phase, it is considered a bubble phase.
How to stop an event from propagating?
1. In this event object, you can use the stopPropagation () method to stop the event from propagating to other components.#N#2. You can use the event.pause () to pause the event.#N#3. You can call pause () or resume () in the capture or bubble phases.
What is system event?
System events are also part of the containment hierarchy fired automatically by the framework during its life cycles, such as during component initialization, changing of an attribute value, and rendering. This movement of events is also known as propagation that determines the sequence in which the event can be processed.
Which container is the first to handle events?
The innermost container is the first to handle events, while the top container is the last to handle events.It is a tree of components with a top-level container as its root. The user actions and events trigger the events resulting from actions and are different from application and component events.
When does the default phase occur?
1. The default phase usually occur after the capture and bubble phases in the order of execution and will not occur if you call event.preventDefault (); while handling the event in any of the capture or bubble phases. 2.
What is event handler in Java?
In this phase, event handlers are called starting from the application root traversing the sub-tree i.e. all the components that are present in each level while moving down towards the source component that fired the event. To test in this phase, just remove the phase attribute from both the handlers because by default the application events are handled in the default phase. You can view the change in both components below:-
Is bubble capture the same as capture?
Bubble and Capture phases are same in application events also as they were in case of component events. There is a 3rd phase also in case of application events which is known as Default Phase. So, let’s learn about bubble and capture phases first:-
What is application event?
An application event is fired from an instance of a component. All components that provide a handler for the event are notified. Always, try and use component events over application events for an effective containment hierarchy.
What is component event?
A component event is fired from an instance of a component. A component event can be handled by the component that fired the event or by a component in the containment hierarchy that receives the event.
What is bubble phase in DOM?
The framework supports capture and bubble phases for the propagation of component events similar to DOM handling patterns. This gives an opportunity for interested components to interact with an event and potentially control the behavior for subsequent handlers.
What are system events fired by?
There are also System events that is fired automatically by the framework during its lifecycle, such as during component initialization, change of an attribute value, and rendering.
Can cmp2 handle a CMP3 event?
Here, an event transmitted by cmp3 can not be handled by cmp2 as its not the outermost component. However, cmp2 can handle it a sits the outermost component and includes cmp2 and cmp3. If you want a container component cmp2 to handle a component event, add an includeFacets=”true” attribute to its handler, such as: