Monday, May 14, 2018

$A.enqueueAction:


Order of Lightning JS controller ' $A.enqueueAction':

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 :
 
01({
02    "echo" : function(cmp) {
03        
04        var action = cmp.get("c.serverEcho");
05        action.setParams({ firstName : cmp.get("v.firstName") });
06 
07        
08        action.setCallback(this, function(response) {
09            var state = response.getState();
10            
11            if (state === "SUCCESS"
12{
13         
14        alert("From server: " + response.getReturnValue());
15 
16//--------second controller Starts--------------
17                
18                var action_2 = cmp.get("c.serverEcho_2");
19                    action.setParams({ firstName : cmp.get("v.firstName") });
20                action.setCallback(this, function(response) {
21                    var state = response.getState();
22            
23                    if (state === "SUCCESS"
24                {
25         
26                    alert("From server: " + response.getReturnValue());
27 
28 
29// -------Third Controller starts ------------
30 
31                            var action_3 = cmp.get("c.serverEcho_3");
32                                action.setParams({ firstName : cmp.get("v.firstName") });
33                            action.setCallback(this, function(response) {
34                                var state = response.getState();
35            
36                                if (state === "SUCCESS"
37                            {
38         
39                                alert("From server: " + response.getReturnValue());
40                            }
41                                });
42                            $A.enqueueAction(action_3);
43         
44 
45            }
46                });
47                $A.enqueueAction(action_2);
48 
49 
50 
51 }
52});
53 
54         
55        $A.enqueueAction(action);
56    }
57})
-------------------------------------------------------------------------

Calling a Server-Side Action

Call a server-side controller action from a client-side controller. In the client-side controller, you set a callback, which is called after the server-side action is completed. A server-side action can return any object containing serializable JSON data.
A client-side controller is a JavaScript object in object-literal notation containing a map of name-value pairs.
Let’s say that you want to trigger a server-call from a component. The following component contains a button that’s wired to a client-side controller echo action. SimpleServerSideController contains a method that returns a string passed in from the client-side controller.
1<aura:component controller="SimpleServerSideController">
2    <aura:attribute name="firstName" type="String" default="world"/>
3    <lightning:button label="Call server" onclick="{!c.echo}"/>
4</aura:component>
This client-side controller includes an echo action that executes a serverEcho method on a server-side controller.
Tip
Use unique names for client-side and server-side actions in a component. A JavaScript function (client-side action) with the same name as an Apex method (server-side action ) can lead to hard-to-debug issues. In debug mode, the framework logs a browser console warning about the clashing client-side and server-side action names.
01({
02    "echo" function(cmp) {
03        // create a one-time use instance of the serverEcho action
04        // in the server-side controller
05        var action = cmp.get("c.serverEcho");
06        action.setParams({ firstName : cmp.get("v.firstName") });
07 
08        // Create a callback that is executed after
09        // the server-side action returns
10        action.setCallback(thisfunction(response) {
11            var state = response.getState();
12            if (state === "SUCCESS") {
13                // Alert the user with the value returned
14                // from the server
15                alert("From server: " + response.getReturnValue());
16 
17                // You would typically fire a event here to trigger
18                // client-side notification that the server-side
19                // action is complete
20            }
21            else if (state === "INCOMPLETE") {
22                // do something
23            }
24            else if (state === "ERROR") {
25                var errors = response.getError();
26                if (errors) {
27                    if (errors[0] && errors[0].message) {
28                        console.log("Error message: " +
29                                 errors[0].message);
30                    }
31                else {
32                    console.log("Unknown error");
33                }
34            }
35        });
36 
37        // optionally set storable, abortable, background flag here
38 
39        // A client-side action could cause multiple events,
40        // which could trigger other events and
41        // other server-side action calls.
42        // $A.enqueueAction adds the server-side action to the queue.
43        $A.enqueueAction(action);
44    }
45})
In the client-side controller, we use the value provider of c to invoke a server-side controller action. We also use the csyntax in markup to invoke a client-side controller action.
The cmp.get("c.serverEcho") call indicates that we’re calling the serverEcho method in the server-side controller. The method name in the server-side controller must match everything after the c. in the client-side call. In this case, that’s serverEcho.
Use action.setParams() to set data to be passed to the server-side controller. The following call sets the value of the firstName argument on the server-side controller’s serverEcho method based on the firstName attribute value.
1action.setParams({ firstName : cmp.get("v.firstName") });
action.setCallback() sets a callback action that is invoked after the server-side action returns.
1action.setCallback(thisfunction(response) { ... });
The server-side action results are available in the response variable, which is the argument of the callback.
response.getState() gets the state of the action returned from the server.
Note
You don’t need a cmp.isValid() check in the callback in a client-side controller when you reference the component associated with the client-side controller. The framework automatically checks that the component is valid.
response.getReturnValue() gets the value returned from the server. In this example, the callback function alerts the user with the value returned from the server.
$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.
Tip
If your action is not executing, make sure that you’re not executing code outside the framework’s normal rerendering lifecycle. For example, if you use window.setTimeout() in an event handler to execute some logic after a time delay, wrap your code in $A.getCallback(). You don't need to use $A.getCallback() if your code is executed as part of the framework's call stack; for example, your code is handling an event or in the callback for a server-side controller action.

Client Payload Data Limit

Use action.setParams() to set data for an action to be passed to a server-side controller.
The framework batches the actions in the queue into one server request. The request payload includes all of the actions and their data serialized into JSON. The request payload limit is 4 MB.

No comments:

Post a Comment