Newer Version Available

This content describes an older version of this product. View Latest

Abortable Actions

Mark an action as abortable to make it potentially abortable while it's queued to be sent to the server. An abortable action in the queue is not sent to the server if the component that created the action is no longer valid, that is cmp.isValid() == false. A component is automatically destroyed and marked invalid by the framework when it is unrendered.

We recommend that you only use abortable actions for read-only operations as they are not guaranteed to be sent to the server.

Note

An abortable action is sent to the server and executed normally unless the component that created the action is invalid before the action is sent to the server. If the component that created the action is invalid, the action state is set to ABORTED.

A non-abortable action is always sent to the server and can't be aborted in the queue.

If an action response returns from the server and the associated component is now invalid, the logic has been executed on the server but the action state is set to ABORTED. This is true whether or not the action is marked as abortable. If the action state is set to ABORTED, only the callback logic associated with the ABORTED state (action.getState() === "ABORTED") will be executed. This enables components to optionally log a message or clean up if they had an aborted action.

Marking an Action as Abortable

Mark a server-side action as abortable by using the setAbortable() method on the Action object in JavaScript. For example:

1var action = cmp.get("c.serverEcho");
2action.setAbortable();

setCallback() has a third parameter that registers the action state that invokes the callback. If you don't specify the third argument for setCallback(), it defaults to registering the SUCCESS and ERROR states.To check for aborted actions in your callback and take appropriate action, such as logging the aborted action, call setCallback() with the ABORTED state set explicitly in the third argument. For example:

1// Process default action states
2action.setCallback(this, function(response) {
3    var state = response.getState();
4    if (state === "SUCCESS") {
5        // Alert the user with the value returned from the server
6        alert("From server: " + response.getReturnValue());
7    }
8    // process other action states
9});
10// Explicitly register callback for ABORTED
11action.setCallback(this,
12    function(response) {
13        alert("The action was aborted");
14    },
15    "ABORTED"
16);

Rapid Clicking

Imagine a navigation menu where each action is a potentially slow request to the server. A user may click on several navigation items quickly so that none of the server responses return before the subsequent click. If all the actions are marked as abortable, none of the callbacks will be called except for the last click. This improves user experience by avoiding flickering due to sequential rendering of multiple server responses.