0

I made sure I understand how the application event should be fired and handled and how the syntax is different from component Event. I executed the example at - https://ck-developer-salesforce-com.360casb.com/docs/atlas.en-us.lightning.meta/lightning/events_application_example.htm.

Applying the same concept to an application that I am building is not giving me the same results.

I have a BoatTile cmp and BoatSelected event(App event) that I am trying to fire and handle it with an independent component that is part of the same lightning home page(app).

BoatTile.cmp

<aura:attribute name="boat" type="Boat__c" description="" />
<aura:attribute name="selected" type="boolean" description="" default="false" />
    <aura:registerEvent name="BoatSelect" type="c:BoatSelect"/>
    <aura:registerEvent name="BoatSelected" type="c:BoatSelected"/>
<lightning:button class="{! v.selected ? 'tile selected' : 'tile' }" onclick="{!c.onBoatClick}">
<div style="{!'background-image:url(\'' + v.boat.Picture__c + '\')'}" class="innertile">
  <div class="lower-third">
   <h1 class="slds-truncate">{!v.boat.Contact__r.Name}</h1>
  </div>
</div>
</lightning:button> 
</aura:component>

BoatTileController.js

({
    onBoatClick : function(component, event, helper) {
        console.log('I am in OnBoatClick action handler');
        var boatObj = component.get("v.boat");
        console.log('boatId ' + boatObj.Id);
        var onBoatClickEvent = component.getEvent("BoatSelect");
        onBoatClickEvent.setParams({
                "boatId" : boatObj.Id
        });
        console.log('onBoatClickEvent Event ' + onBoatClickEvent.getParam("boatId"));
        onBoatClickEvent.fire();

        var boatSelectedEvent = $A.get("e.c:BoatSelected");

        boatSelectedEvent.setParams({
            "boat" : boatObj
        });
        console.log('boatSelectedEvent Event ' + JSON.stringify(boatSelectedEvent.getParam("boat")));
        boatSelectedEvent.fire();

    }
})

BoatSelected Event:

<aura:event type="APPLICATION" description="BoatSelected">
    <aura:attribute name="boat" type="boat__c"/>
</aura:event>

The handler component is BoatDetails.cmp:

<aura:component implements="flexipage:availableForAllPageTypes" description="BoatDetails">
    <aura:handler name="BoatSelected" event="c:BoatSelected"
                  action="{!c.onBoatSelected}"/>
    <aura:attribute name="boat" type="Boat__c"/>
    <aura:attribute name="Id" type="Id"/>
    <aura:if isTrue="{!not(empty(v.boat))}">
    <lightning:tabset>
        <lightning:tab label="Details">
            Details
        </lightning:tab>
        <lightning:tab label="Reviews">
            Reviews
        </lightning:tab>
        <lightning:tab label="Add Review">
            Add Review
        </lightning:tab>
    </lightning:tabset>
    </aura:if>
</aura:component>

Controller for above cmp:

({
    onBoatSelected : function(component, event, helper) {

        console.log('onBoatSelected is called now');
        var boatObj = event.getParam("boat");
        component.set("v.Id",boatObj.Id);
        console.log('onBoatSelected sets the ID attr ' +component.get("v.Id"));
    }
})

I have to put the console log to see if the handler action gets invoked, which is not happening. My above component is not much different than the example given at - https://ck-developer-salesforce-com.360casb.com/docs/atlas.en-us.lightning.meta/lightning/events_application_example.htm

Any idea what I could be possible missing here

1 Answer 1

4

Application event handlers cannot have name. In the same link you have added in the question read it through and it has the information. Only component event handlers have name.

<aura:handler event="c:aeEvent" action="{!c.handleApplicationEvent}"/>
1
  • Wow great catch. The statement says -` The name attribute is required but not used for application events. The name attribute is only relevant for component events.` that makes me think I can use Name attribute but it wont be required. However using a name attr does not invoke the action handler. I feel the statement could be more clearer!
    – Arnold
    Dec 25, 2017 at 17:24

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .