+ Start a Discussion
Vishakha SomanVishakha Soman 

Invalid key Error

Hi,
Can anyone please let me know where exactly I am going wrong
I facing following error
This page has an error. You might just need to refresh it. Action failed: c:TestUpdateComponent$controller$editAccount [Invalid key saveAccountList] Failing descriptor: {c:TestUpdateComponent$controller$editAccount}
Here is my code :
apex class
public class TestUpdateController {
    
    @AuraEnabled
    public static List<Account> getAccListApex(List<Id> accountIds){
        List<Account> accList = new List<Account>();
        accList = [Select Id,Name, Type, Website,Phone,Industry from account limit 5];
        return accList;
    }
    @AuraEnabled
    Public static Map<String,String> saveAccountList(List<Account> accLists){
        Map<String,String> resultMap = new Map<String,String>();
        try{
        update accLists;
         resultMap.put('status','success');  
        resultMap.put('message','Account updated Sucessfully');
        }
        catch(Exception e){
            resultMap.put('status','error');
                 resultMap.put('message',e.getMessage());
        }
        return resultMap;
    }
}
------------------------------------------------------------------------------------
({
    getAccountListhelper : function(component) {
        //add action to global action queue and that action will get Apex controller and fetch list
        var action = component.get("c.getAccListApex");
        action.setParams({accountIds : component.get("v.recordId")});
        action.setCallback(this,function(response){
            var state = response.getState();
            if(state === 'SUCCESS') {
                console.log("====response====",response.getReturnValue());
                component.set("v.accountList",response.getReturnValue());
                
            }
            else {
                alert('Error in getting data');
            }            
        });
        // Adding the action variable to the global action queue
        $A.enqueueAction(action);
    },
    saveAccount: function(component, event, helper){
        var accList = component.get('v.accountList');
        var recordViewForm = component.find('recordViewForm');
        var recordEditForm = component.find('recordEditForm'); 
        var saveAction = component.get('saveAccountList');
        var btn = event.getSource();
        var name = btn.get('v.name');
        var toastEvent = $A.get("e.force:showToast");
        saveAction.setParams({accLists: accList});
        saveAction.setCallback(this,function(response){
            if(state === 'SUCCESS') {
                var dataMap = response.getReturnValue();
                if(dataMap.status=='success'){
                    $A.util.addClass(recordEditForm,'formHide');
                    $A.util.removeClass(recordViewForm,'formHide');
                    btn.set('v.name','edit');
                    btn.set('v.label','Edit');
                    
                    toastEvent.setParams({
                        "title": "Success!",
                        "message": "Account updated Successfully!"
                    });
                    toastEvent.fire();
                }
                else if(dataMap.status=='error'){
                    toastEvent.setParams({
                        "title": "Error!",
                        "message": "Error!"
                    });
                    toastEvent.fire();
                }
                
            }
            else {
                alert('Error in updating data');
            }       
            
        });
        $A.enqueueAction(saveAction);  
        
    }
    
})
----------------------------------------------------------------------------------
controller
({
    getAccountList : function(component, event, helper) {
        helper.getAccountListhelper(component);
        
    },
    createRecord : function (component, event, helper) {
        //global action only work under one app container
        alert('in global action');
        var createRecordEvent = $A.get("e.force:createRecord");
        createRecordEvent.setParams({
            "entityApiName": "Account",
            "defaultFieldValues":{
                'AccountId':component.get("v.recordId")
            }
        });
        createRecordEvent.fire();
    }   ,
    editAccount:function(component, event, helper) {
        //give refrence to button
        var btn = event.getSource();
        var name = btn.get('v.name');
        // Getting the record view form and the record edit form elements
        var recordViewForm = component.find('recordViewForm');
        var recordEditForm = component.find('recordEditForm'); 
        if(name=='edit') {
            $A.util.addClass(recordViewForm,'formHide');
            $A.util.removeClass(recordEditForm,'formHide');
            
            btn.set('v.name','save');
            btn.set('v.label','Save');
        }
        else if(name=='save') {
            // Calling save if the button is save
            helper.saveAccount(component, event, helper);
        }
    }
})
-----------------------------------------------------------------------------------
component

<aura:component implements="flexipage:availableForAllPageTypes,force:hasRecordId" controller="TestUpdateController" access="global">
    
    <aura:attribute type="List" name="accountList"/>
    <aura:handler name="init" action="{!c.getAccountList}" value="{!this}" />
    <lightning:card title="Account">
        
        <p class="slds-p-horizontal_small">
            <div aura:id="recordViewForm">
                <aura:iteration items="{!v.accountList}" var="account">
                    <lightning:recordViewForm recordId="{!account.Id}" objectApiName="Account">
                        <div class="slds-box slds-theme_default">
                            <lightning:outputField fieldName="Name" />
                            <lightning:outputField fieldName="Website" />
                            <lightning:outputField fieldName="Phone" />
                            <lightning:outputField fieldName="Type" />
                        </div>
                    </lightning:recordViewForm>
                    <br />
                </aura:iteration>
            </div>
            <div aura:id="recordEditForm" class="formHide">
                <aura:iteration items="{!v.accountList}" var="account">
                    <lightning:recordEditForm recordId="{!account.Id}" objectApiName="Account">
                        <lightning:inputField fieldName="Name" />
                        <lightning:inputField fieldName="Website" />
                        <lightning:inputField fieldName="Phone" />
                        <lightning:inputField fieldName="Type" />
                        
                    </lightning:recordEditForm>
                </aura:iteration>
            </div>
        </p>
        <aura:set attribute="actions">
            <lightning:button label="New" onclick="{!c.createRecord}"/>
            <lightning:button variant="brand" label="Edit" name="edit" onclick="{!c.editAccount}"/>
        </aura:set>
        
    </lightning:card>
</aura:component>
----------------------------------------------------------------------------
Manish Singh BishtManish Singh Bisht

Hi Vishakha,
Your error is coming from the the method "saveAccount" inside the helper.js file.

In that method, this particular line:

var saveAction = component.get('saveAccountList');
should have been:
var saveAction = component.get('c.saveAccountList');
That c.  is missing from the name of the Apex method.