0

I have a main component that creates different instances of a child component which all have inputs and checkboxes. What I want is that whenever I change the value in a picklist for a child component, fire an event that can be handled by each of the other child components.

Right now I have an Application event, the registerEvent and handler are set all on the child component. Whenever I fire the event it is only handled in the same component, not in the other similar ones.

This is the raw setup:

ParentComponent:

  • Children component #1

  • Children component #2

  • Children component #3

Lightning app:

<aura:application access="GLOBAL" extends="ltng:outApp" >
    <aura:dependency resource="c:testParentComponent"/>
</aura:application>

Lightning component parent:

<c:childComponent>
<c:childComponent>

Lightning component child.cmp:

<aura:registerEvent name="changeValue" type="c:changePicklistvalue"/>
<aura:handler name="changeValue" action="{! c.handleDependencyChange}" event="c:changePicklistvalue" />

Lightning component child.js:

callDependencyChange: function(cmp, event, helper) {
    // event.stopPropagation();
    var compEvent = cmp.getEvent("changeValue");
    compEvent.fire();

    window.alert('callDependencyChange');
},  

handleDependencyChange : function(cmp, event) {
        window.alert('handleDependencyChange: ');
        var fieldName = cmp.get("v.fieldName");
        window.alert('fieldName: ' + fieldName);
        if (fieldName == 'Type') {
            cmp.find("selectList").set("v.value", "porotos");
        }
    }

Note that each children component is the same lightining component created in different instances. How can I handle events for each of the children components?

  • Hi, I am not sure to understand the problem that you are facing. This scenario is supported by Application events. I just did a quick try by placing twice the same component that fire/handles an event in a test app and the event is caught twice. – POZ Aug 18 '17 at 14:11
  • In my case only the component that fired the event is able to handle it – Marcos Carri Aug 18 '17 at 14:58
0

I've found the solution. Instead of getting the event by the registerEvent name: var compEvent = cmp.getEvent("changeValue");

You should use:

var cmpEvent = $A.get("e.c:changeValueEvent");

and retrieve the event by its original name.

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.