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

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}"/>
  • 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 '17 at 17:24

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.