function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
ZGZG 

How to call the setCallback function with a callback function

Hello, I am new to Lightning and am going through the Lightning Components Basics module.

In the expensesHelper.js file would like to find out if it's possible to move the callback function definition inside the setCallback function to its own function and pass it in the arguments.

Instead of this: 
({ 
    createExpense: function(component, expense) {
        var action = component.get("c.saveExpense");
        action.setParams({
            "expense": expense
        });
        action.setCallback(this, function(response){
            var state = response.getState();
            if (state === "SUCCESS") {
                var expenses = component.get("v.expenses");
                expenses.push(response.getReturnValue());
                component.set("v.expenses", expenses);
            }
        })
        $A.enqueueAction(action);
    },
    
    
})

I would like to move the callback function defintion out into its own function like this:
  
({ 
    createExpense: function(component, expense) {
        var action = component.get("c.saveExpense");
        action.setParams({
            "expense": expense
        });
        action.setCallback(this, this.cbackfunction);
        $A.enqueueAction(action);
    },
    
    cbackfunction: function(response){
            var state = response.getState();
            if (state === "SUCCESS") {
                var expenses = component.get("v.expenses");
                expenses.push(response.getReturnValue());
                component.set("v.expenses", expenses);
            }
        }
    
})

WIth the code above I am getting the run-time error: "Error in $A.getCallback() [component is not defined]
   Callback failed: apex://ExpensesController/ACTION$saveExpense
   Failing descriptor: {c:expenses}"

I added a console log to make sure that "this.cbackfunction" exists and it does: 

    
console.log("this.cbackfunction: " + this.cbackFunction);
     this.cbackfunction: function (response) {
            var state = response.getState();
            var expenses = component.get("v.expenses");
            expenses.push(response.getReturnValue()); component.set("v.expenses", expenses);
        }

So, the cback function is visible from within the createExpense function.

Any ideas on how to call setCallback with a callback function?
Raj VakatiRaj Vakati
Try something like below 
  
({ 
createExpense: function(component, expense) {
 var onSuccessCall = function(request){
        var expenses = component.get("v.expenses");
		expenses.push(request);
    	component.set("v.expenses", expenses);
}

helper.retrieveStatus(component,onSuccessCall);		

   
},


})


In Helper

({
retrieveStatus: function (cmp,  onSuccess) {

 var action = component.get("c.saveExpense");
	action.setParams({
		"expense": expense
	});
	action.setCallback(this, function(response){
		var state = response.getState();
		if (state === "SUCCESS") {
		 var ret = response.getReturnValue();
			onSuccess(ret);
		  
		}
	})
	$A.enqueueAction(action);
	
  },

})

 
ZGZG
Hi Raj, I want to move the function(response){...} definition out to its own function and then pass that function into action.setCallback.
ZGZG
Hello again, if anyone's interested, I received an answer to my question on stackexchange:
"
You can move the body into another method, but you need to put a method inside the callback to call the other method to preserve the parameter: 

({ 
     createExpense: function(component, expense) {
         var action = component.get("c.saveExpense");
         action.setParams({
            "expense": expense
        });
         action.setCallback(this, 
             response => this.cbackfunction(component, response));
         $A.enqueueAction(action);
     },
    cbackfunction: function(component, response){
            var state = response.getState();
            if (state === "SUCCESS") {
                var expenses = component.get("v.expenses");
                expenses.push(response.getReturnValue());
                component.set("v.expenses", expenses);
            }
        }
})


"