You need to sign in to do that
Don't have an account?
harry.kim
Can I call an other component's function in modal component
Hello.
I had created a modal component when I click a button like below.
createGroup : function(component, event, helper) {
$A.createComponent(
"c:NLPCreatePublicGroup",
{
"aura:id": "NLPCreatePublicGroup"
},function(newCmp){
component.set("v.modal", newCmp);
}
);
},
I want to call a function of another component by pressing a certain button in this component.
So, I had made an lightning event component named 'NLPRefreshRole'
Then registered the event in a modal component and insert the code that activates the event.
<aura:registerEvent name="refreshRole" type="c:NLPRefreshRole"/>
var evt = component.getEvent("roleClickEvt");
evt.fire();
Then I put the following handler in the target component
<aura:handler name="refreshRole" event="c:NLPRefreshRole" action="{!c.renderTreeN}"/>
But it does not work properly.
How can I call the other component's function in modal component ?
I had created a modal component when I click a button like below.
createGroup : function(component, event, helper) {
$A.createComponent(
"c:NLPCreatePublicGroup",
{
"aura:id": "NLPCreatePublicGroup"
},function(newCmp){
component.set("v.modal", newCmp);
}
);
},
I want to call a function of another component by pressing a certain button in this component.
So, I had made an lightning event component named 'NLPRefreshRole'
Then registered the event in a modal component and insert the code that activates the event.
<aura:registerEvent name="refreshRole" type="c:NLPRefreshRole"/>
var evt = component.getEvent("roleClickEvt");
evt.fire();
Then I put the following handler in the target component
<aura:handler name="refreshRole" event="c:NLPRefreshRole" action="{!c.renderTreeN}"/>
But it does not work properly.
How can I call the other component's function in modal component ?
Does it make any difference if you change the event name in component.getEvent to "refreshRole" like this. Regards,
Miika
To call a function of 2nd component by pressing a certain button on 1st component try the following:
1st Component:
<aura:component >
<aura:attribute name = "Cmp2" type = "Boolean" default = "false"/> <!--Make Same attribute in both Components-->
<lightning:button label = "Click to run another component" onclick = "{!c.handleClick}"/>
{!v.body}
</aura:component>
({
handleClick : function(c, e, h) {
$A.createComponent('c:TestComponent2', {
'Cmp2': c.getReference('v.Cmp2'),
}, function (contentComponent, status, error) {
if (status === "SUCCESS") {
console.log('SUCCESS');
c.set('v.Cmp2',true);
c.set('v.body',contentComponent);
} else {
console.log('FAIL');
}
});
}
})
2nd Component:
<aura:component >
<aura:attribute name = "Cmp2" type = "Boolean" default = "false"/><!--Same Component in both Components-->
<lightning:button label="Click to run function of other cmp" onclick = "{!c.callFunction}"/>
</aura:component>
({
callFunction : function(c, e, h) {
console.log('callFunction in 2nd Component called');
}
})
I hope you find the above solution helpful. If it does, please mark as Best Answer to help others too.
Thanks,
Ajay Dubedi
I had used below code. but it was not working. T.T
var evt = component.getEvent("refreshRole"); // not "roleClickEvt"
evt.fire();
Actually I have the 3 components
1. Parent Component => have a button and It creates the modal component.
2. modal Component => have a button. If I click the button, I would like to call a function in the target component.
3. target Component => hava the function.