function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
SFDC pvSFDC pv 

Can someone please help me on how to call a child component from Parent component

If i click on the "New Button" i need to call the child component which is a pop up window. 
This is my component  i will place the below icon on my case page

Parent Component : - 
<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" controller ="Test_CreateXXController" access="global" >
   
   <aura:attribute name="isOpen" type="boolean" default="false"/>
   <aura:attribute name="recordId" type="String" />  
   <c:Testcomponent  aura:id="child"/>
 <!--  <aura:handler name="init" value="{!this}" action="{!c.doInit}"/> -->
   <div onclick="{!c.doInit}">
        <a class="Fontcolor" href=""><lightning:card iconName="utility:info" title="New Button" /></a>          
    </div> 
<!-- </div> -->    
</aura:component>

Controller:-

({
    doInit: function(component, event, helper) {
        
        console.log('intosearch');
      //helper.Navigate(component, event, helper);      
          var testComponent = component.find('child');
        console.log('childcomponent');
          testComponent.getchildMethod(); 
   } 

})
Child component :- 

<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" access="global" >
    <aura:method name="getchildMethod" action="{!c.doAction}"/> 
    <aura:attribute name="isOpen" type="boolean" default="True"/>    

This is not working. Please help me out.
Khan AnasKhan Anas (Salesforce Developers) 
Hi,
 

I trust you are doing very well.
 

Below is the sample code to create the contact using aura method which I have tested in my org and it is working fine. Kindly modify the code as per your requirement.

Parent Component: LightningMethodParent 
<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" access="global" >
    
    <aura:attribute name="accounts" type="Account[]" />
    
    <div class='slds-m-around_x-small'>
        <div class="slds-page-header">
            <div class="slds-media__body">
                <h1 class="slds-page-header__title slds-truncate slds-align-middle" 
                    title="Create Contact">
                    Create Contact
                </h1>
            </div>
            
        </div>
        <div class="demo-only demo-only--sizing slds-grid slds-wrap">
            <div class="slds-size_1-of-2">
                
                <lightning:button variant="brand" label="Create Contact" 
                                  iconName="standard:contact" 
                                  iconPosition="left" onclick="{!c.doCreateContact }" />
            </div>
            <c:LightningMethodChild aura:id='quickContact'/>
        </div>
    </div>
</aura:component>

Parent Controller: LightningMethodParent Controller 
({    
    doCreateContact : function(component, event, helper){
        var createConComponent = component.find('quickContact');
        // call the child controller method
        createConComponent.createContact();        
    },
})

Child Component: LightningMethodChild 
<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" access="global" >
    
    <aura:method name="createContact" action="{!c.doCreateContact}" 
                 description="Create Contact"> 
    </aura:method>
</aura:component>

Child Controller: LightningMethodChildController 
({
    doCreateContact : function(component, event, helper) {
        // fetch the value from the parent component
        var params = event.getParam('arguments');
        if(params){
            // get a create record event 
            var createAcountContactEvent = $A.get("e.force:createRecord");
            createAcountContactEvent.setParams({
                "entityApiName": "Contact", 
            });
            createAcountContactEvent.fire(); 
        }
    },
})


Note: When you try to launch the component via app in the developer console, standard events (createRecord, showToast, navigateToSobject, etc) will be undefined.
Therefore launch LightningMethodParent component in LEX via app builder or create a lightning tab or lightning quick action or drag to the detail page to check how it works.


I hope it helps you.

Kindly let me know if it helps you and close your query by marking it as solved so that it can help others in future.

Thanks and Regards,
Khan Anas
Khan AnasKhan Anas (Salesforce Developers) 
Hi,

You need to change the controller method name from doInit to Search. And also, change the helper method name.

Controller: 
Search: function(component, event, helper) {       
        console.log('intosearch');
        helper.doSearch(component, event, helper);
    }

Helper: 
doSearch : function(component, event, helper) {
      //Code
}

I hope it helps you.

Kindly mark this as solved if the information was helpful.

Thanks and Regards,
Khan Anas
SFDC pvSFDC pv
I have achieved that using Event. Here when i click on search i need to make a callout and listout the response as line items in the UI. I'm not getting proper response when i click on the Search button(see the below log). It would be great if you could help me on resolving this error 

intosearchHelper
Test_ModalSearchComponent.js:16 actionSecureAction: [object Object]{ key: {"namespace":"c"} }
Test_ModalSearchComponent.js:23 ####returnvalueERROR
Test_ModalSearchComponent.js:25 ####parentIdnull
Test_ModalSearchComponent.js:14 intosearchHelper
Test_ModalSearchComponent.js:16 actionSecureAction: [object Object]{ key: {"namespace":"c"} }
Test_ModalSearchComponent.js:23 ####returnvalueERROR
Test_ModalSearchComponent.js:25 ####parentIdnull

Test_ModalSearchComponent:-
<aura:component controller ="Test_xxController" implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" access="global" >
                      <div style="display:inline-block;margin-right:10px" onclick="{!c.Search}"> 
                        <lightning:icon iconName="utility:search" size="small" >
                           </lightning:icon>

Controller:-

({
        Search : function(component, event, helper) {
        var action = component.get("c.invokeWebService");
        console.log('action');
        action.setParams({
            "CaseId" : component.get("v.recordId")
        
        });
        action.setCallback(this, function(response) {
        var state = response.getState();
        console.log('####returnvalue'+state);
        var parentId = component.get('v.recordId');
        console.log('####parentId'+response.getReturnValue());
        
        if (state == "SUCCESS") { 
                var output = response.getReturnValue();
                component.set("v.response", output);
                console.log(output);
        }   
   }); 
             $A.enqueueAction(action);
},
})

Apex controller:-

global class Test_xxController {
    
    @AuraEnabled
    @future(callout=true)
    Public static void invokeWebService(String CaseId) {
        
        Map <String,xx_Information__c > FFMap = new Map <String,xx_Information__c> ();   
        
        Map<String, Integer> monthAndMonthNumberMap = new Map<String, Integer>();
        monthAndMonthNumberMap.put('Jan', 1);
        monthAndMonthNumberMap.put('Feb', 2);
        monthAndMonthNumberMap.put('Mar', 3);
        monthAndMonthNumberMap.put('Apr', 4);
        monthAndMonthNumberMap.put('May', 5);
        monthAndMonthNumberMap.put('Jun', 6);
        monthAndMonthNumberMap.put('Jul', 7);
        monthAndMonthNumberMap.put('Aug', 8);
        monthAndMonthNumberMap.put('Sep', 9);
        monthAndMonthNumberMap.put('Oct', 10);
        monthAndMonthNumberMap.put('Nov', 11);
        monthAndMonthNumberMap.put('Dec', 12);
        
        List<Case> Caslist= [SELECT Id,AccountID,xx_Number__c FROM Case  WHERE ID =:CaseId ];
        List<xx_Information__c> listofFF = new List<xx_Information__c>();
        List<xx_Information__c> DFFlist= new list<xx_Information__c>([SELECT xx_Number__c FROM xx_Information__c WHERE Case__c =:CaseId ]);
        
        Set<String> loffinstr = new Set<String>();
        Set<String> Dloffinstr = new Set<String>();
        Set<String> Nloffinstr = new Set<String>();
        Boolean isDuplicate;
        for(xx_Information__c finfo : DFFlist ){
            loffinstr.add(finfo.xx_Number__c);
            Dloffinstr.add(finfo.xx_Number__c);
            
        }
        Case Cas= [SELECT Id,AccountID,xx_Number__c FROM Case  WHERE ID =:CaseId ];
        system.debug('***Case-FF***'+Cas);
 
            for (String num : Cas.xx_Number__c.split(',') )
            {
                system.debug('Numbers'+num);
                if (Nloffinstr.Contains(num)) {
                  //  Isduplicate = true;                
                }
                else {
                    Nloffinstr.add(num);
                }
                
                if(num!='' && !loffinstr.contains(num)){
                    system.debug('insideloop'+num);
                    loffinstr.add(num);
                    xx_ResponseWrapper xxResponse = xx_InvokeAPI.invokexxAPI(num);                 
                    system.debug('$$$xxResponse$$$'+xxResponse);              
                    if(xxResponse != Null){
                        xx_Information__c ff = new xx_Information__c();
                        ff.Name = xxResponse.firstName+' '+xxResponse.lastName;
                        ff.xx_Email__c = xxResponse.email;
                        ff.xx_Number__c = num;
                        ff.Case__c = Cas.ID;
                        ff.Account__c = Cas.AccountId;
                        
                        for(xx_xxResponseWrapper.programDetails  program: xxResponse.programDetails){ 
                            if(program.ffExpireDate!=null){
                                String myDateStr = program.ffExpireDate;
                                System.debug('$$$ mydateStr: '+ myDateStr);
                                List<String> myDateList = myDateStr.split('-');
                                Integer yearVal = Integer.valueOf(myDateList.get(2));
                                Integer monthVal = monthAndMonthNumberMap.get(myDateList.get(1));
                                Integer dayVal = Integer.valueOf(myDateList.get(0));
                                date mydate = date.newinstance(yearVal,monthVal,dayVal);
                                ff.Freq_Flyer_Expiry_Date__c = mydate;
                                ff.Current_Tier__c = program.tierName;
                            }                         
                        } 
                        ff.Request_Type__c = '';
                        ff.Upgrade_Tier_Requested__c = '';                               
                        listofFF.add(ff); 
                    }
                }
            }            

        if(listofFF.size()>0) {
            insert listofFF;              
            system.debug('Insertion'+listofFF);    
        }
    }
}