0

I have a parent component which iterates over a child component and has a save button. Parent.cmp:

 <aura:attribute name="casAgentList" type="Availability_Of_CAS_OneMDCS__c[]"/>
 ...
 <tbody>
            <aura:iteration items="{!v.casAgentList}" var="item">
                <c:childComp appo="{!item}"/>
                <br/>
            </aura:iteration>               
        </tbody>  
...
<lightning:button variant="brand" onclick="{! c.saveRecord }" > Save </lightning:button>

Next the child component displays a table. child cmp:

<aura:attribute name="appo" type="Availability_Of_CAS_OneMDCS__c"/>
<aura:attribute name="availableList" type="List"/>
<aura:attribute name="starttimeList" type="List"/>
<aura:attribute name="endtimeList" type="List"/> 
<aura:attribute name="isstartdisable" type="Boolean" default="true"/>
<aura:attribute name="isenddisable" type="Boolean" default="true"/>
<aura:attribute name="iscommentdisable" type="Boolean" default="true"/>

<aura:handler name="init" value="{!this}" action="{!c.myAction}"/>
 <tr>
    <td>
        {!v.appo.CAS_Team_OneMDCS__r.Name}
    </td> 
    <td style="padding-right: 5px;">
       <lightning:select name="{!v.appo.Id}" onchange="{!c.dorefresh}" aura:id="firstpicklistid">
            <Option text="--None--" value="--None--" disabled="true"/>
            <option value="{!v.appo.Availability__c}" text="{!v.appo.Availability__c}"> </option>

            <aura:iteration items="{!v.availableList}" var="inneritem">
                <aura:if isTrue="{! notequals(v.appo.Availability__c,inneritem) }">
                    <option value="{!inneritem}" text="{!inneritem}"></option>
                </aura:if>                                    
            </aura:iteration>
        </lightning:select> 

    </td>
 ...

Next the child controller has the definition for myaction and do refresh function. child controller:

myAction : function(component, event, helper) {

    console.log('Offtimeselection cmp 2');
    var action2 = component.get("c.getselectOptions");
    action2.setParams({
        "field": 'Availability__c'
    });        
    action2.setCallback(this, function(response) {
        if (response.getState() == "SUCCESS") {                
            component.set("v.availableList",response.getReturnValue());
        }
    });        
    $A.enqueueAction(action2); 

    var action3 = component.get("c.getselectOptions");
    action3.setParams({
        "field": 'Start_Time__c'
    });      
    ...
    dorefresh : function(component, event, helper) {
    var checkval = component.find("firstpicklistid").get("v.value");
    console.log('checkval'+checkval);
    if(checkval != 'Partial Day'){
        component.set("v.isstartdisable",true);
        component.set("v.isenddisable",true);
    }
    else{
        component.set("v.isstartdisable",false);
        component.set("v.isenddisable",false);
    }
    ...

The issue is, how do I save the values in the child component when the save button is clicked on the parent component? I tried using events but since the parent component is iterating on the child component, the event will fire multiple times taking too much time. I need to store the data of the child component in a map or list and then push everything together to the database. Any ideas or help would be appreciated.

2 Answers 2

3

You either want to use an aura:method for this or pass an attribute.

I suggest that you read the Lightning Inter-Component Communication Patterns blog post to get an overview of the different communication means that are available to you.

0

Typically when you are talking about Top down approach you don't need events. Like @POZ suggested use an aura:method or pass either a Sobject attribute or if you have values from multiple objects prepare a JSON string and pass down a String attribute.

In your child component use a handler to detect data changes on the passed down attribute and fire a call to the server side on handlers action like in the below link.

Detecting Data Changes with Change Handlers

2
  • 1
    No need for JSON in a situation like this, the Object attribute is very multipurpose and it's simple to pass a JS object if needed.
    – tsalb
    Jun 9, 2018 at 6:54
  • @tsalb The reason I mentioned JSON was it would be easy to manipulate in backend apex when you have a mix of attributes. Jun 9, 2018 at 14:09

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .