+ Start a Discussion
EldonEldon 

order of Lightning JS controller ' $A.enqueueAction'

Hi,

I have developed an app using lightning components. I have 5 apex server calls in the init function of its JS controller.
But some time my app is not loading fine. Some time it is loading correctly. I have given the '$A.enqueueAction' of all server calls at last part after all server calls in the init fnction. Is there any order in giving the '$A.enqueueAction' of each server calls if there are multiple APEX server calls in single function?

Thankyou
Best Answer chosen by Eldon
Aabhi BattaAabhi Batta
If we need to call more than one server side controller then we need to write a second controller inside the First setCallBack method , the third controller inside the second Controller and so on . 
Like this way we can achieve the right output always . This is the correct way to call $A.enqueueAction() .

 


The code is here :  
 
({
    "echo" : function(cmp) {
       
        var action = cmp.get("c.serverEcho");
        action.setParams({ firstName : cmp.get("v.firstName") });

       
        action.setCallback(this, function(response) {
            var state = response.getState();
           
            if (state === "SUCCESS") 
{
        
        alert("From server: " + response.getReturnValue());

//--------second controller Starts--------------
               
                var action_2 = cmp.get("c.serverEcho_2");
                    action.setParams({ firstName : cmp.get("v.firstName") });
                action.setCallback(this, function(response) {
                    var state = response.getState();
           
                    if (state === "SUCCESS") 
                {
        
                    alert("From server: " + response.getReturnValue());


// -------Third Controller starts ------------

                            var action_3 = cmp.get("c.serverEcho_3");
                                action.setParams({ firstName : cmp.get("v.firstName") });
                            action.setCallback(this, function(response) {
                                var state = response.getState();
           
                                if (state === "SUCCESS") 
                            {
        
                                alert("From server: " + response.getReturnValue());
                            }
                                });
                            $A.enqueueAction(action_3);
        

            }
                });
                $A.enqueueAction(action_2);



 }
});

        
        $A.enqueueAction(action);
    }
})

Thanks.

All Answers

Ishwar ShindeIshwar Shinde
$A.enqueueAction(action) adds the server-side controller action to the queue of actions to be executed. All actions that are enqueued will run at the end of the event loop. Rather than sending a separate request for each individual action, the framework processes the event chain and batches the actions in the queue into one request. The actions are asynchronous and have callbacks.

Check below link for more infomration- 
https://developer.salesforce.com/docs/atlas.en-us.lightning.meta/lightning/controllers_server_actions_call.htm
Aabhi BattaAabhi Batta
If we need to call more than one server side controller then we need to write a second controller inside the First setCallBack method , the third controller inside the second Controller and so on . 
Like this way we can achieve the right output always . This is the correct way to call $A.enqueueAction() .

 


The code is here :  
 
({
    "echo" : function(cmp) {
       
        var action = cmp.get("c.serverEcho");
        action.setParams({ firstName : cmp.get("v.firstName") });

       
        action.setCallback(this, function(response) {
            var state = response.getState();
           
            if (state === "SUCCESS") 
{
        
        alert("From server: " + response.getReturnValue());

//--------second controller Starts--------------
               
                var action_2 = cmp.get("c.serverEcho_2");
                    action.setParams({ firstName : cmp.get("v.firstName") });
                action.setCallback(this, function(response) {
                    var state = response.getState();
           
                    if (state === "SUCCESS") 
                {
        
                    alert("From server: " + response.getReturnValue());


// -------Third Controller starts ------------

                            var action_3 = cmp.get("c.serverEcho_3");
                                action.setParams({ firstName : cmp.get("v.firstName") });
                            action.setCallback(this, function(response) {
                                var state = response.getState();
           
                                if (state === "SUCCESS") 
                            {
        
                                alert("From server: " + response.getReturnValue());
                            }
                                });
                            $A.enqueueAction(action_3);
        

            }
                });
                $A.enqueueAction(action_2);



 }
});

        
        $A.enqueueAction(action);
    }
})

Thanks.
This was selected as the best answer
Mohan Babu KJMohan Babu KJ
Hello Aabhi,

Can you please let me know in line 19, should I need to use action_2 or action as you had declared action_2 for the component to get. I used the similar code and am getting error as "Uncaught Error in $A.getCallback() [v is not defined] Callback failed"
 
var recordId = component.get("v.recordId");
        var action = component.get("c.getAccountDisplaySamples");
        action.setParams({ "recordId" : recordId });
        action.setCallback(this, function(response) {
            var state = response.getState();
            if (component.isValid() && state === "SUCCESS") {
                component.set("v.displaySamples", response.getReturnValue());
                console.log(response.getReturnValue());
                //helper.getPlacementStatus(component);
                var action_1 = component.get("c.getPlacementStatusPicklistValues");
                //var inputsel = component.find("statusId");
                var options = [];
                action_1.setParams({ "object_name" : 'Sample_Display_Inventory__c' });
                action_1.setCallback(this, function(res){
                    var state = res.getState();
                    if (component.isValid() && state === "SUCCESS") {
                        for(var i=0;i< res.getReturnValue().length;i++){
                            options.push({label: res.getReturnValue()[i], value: res.getReturnValue()[i]});
                        }
                        component.set("v.placementStatus", options);
                        console.log(v.placementStatus);
                    } 
                });
                $A.enqueueAction(action_1);
            }
        });
        $A.enqueueAction(action);

Thanks.

Regards,
MB
Aabhi BattaAabhi Batta
Hi Mohan,

Remove the 21st line, then your code will run without any exception.

Regards,
Abhi
 
vijayskvijaysk
Hi Aabhi,

Can we handle the above multiple server side calls in Client side JS controller it self or can we also create differemt helper to make different server side calls?

Which is the best way according to the performance as suggested by salesforce.

Regards,
Vijay.