1

I have two components componentA and componentB. Included ComponentB inside componentA

e.g.

<!--Component A-->
<aura:component>

<!--Component B-->
<aura:iteration>
      <c:componentB prod="{!prod}"/>
</aura:iteration>

</aura:component>

I want to refresh parent component (componentA) if user deletes any product from componentB. Delete functionality is working fine but the issue is that i am not able to refresh parent component from child.

3

To use Lightning Events, you need first to create event.

You can create application event or component event.

This is the code for component event sample.

<aura:event type="COMPONENT">
    <aura:attribute name="message" type="String"/>
</aura:event>

Then you need to define your event in your child component like this

<aura:registerEvent name="lightningEvent" type="c:LightningEvent"/>

and fire it somewhere in your code. Either in controller or in helper. It is usually better to have it in helper.

// on delete inside component B
var event = component.getEvent("lightningEvent");
event.setParam("message", "the message to send" );
event.fire();

On the next step you need to define handler for the event in your parent component like this.

<aura:handler name="lightningEvent" event="c:LightningEvent" action="{!c.handleEvent}"/>

The name and type should match the values on the definition.

Also you need to define method handleEvent in controller

handleEvent: function(component, event, helper) {
    // refresh Component A here
    var message = event.getParam("message");
    alert(message);
}
  • @NileshBorse You are welcome – Patlatus Nov 1 '17 at 9:06

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.