JQuery $.post in a function. Wait for callback to define the return.

Question

How would I, using $.post() in a function, force the return on the post callback?

Example:

function myFunction(){
   $.post(postURL,mydata,function(data){
      return data; 
   });
}

I have tried playing around with it using .done() and .queue() however neither has worked for me. I understand there is a fundamental flaw in my example; with that said, how can I achieve my desired functionality?

Why do you want to do it this way? You need to use a callback function that will process the returned data. — gen_Eric, Jul 29 '11 at 18:21
and after said data is processed i need certain values to be passed back. — rlemon, Jul 29 '11 at 18:31
You may need to refactor your code, because there is no good way to do this. — gen_Eric, Jul 29 '11 at 18:42

score 6 · Accepted Answer · answered Jul 29 '11 at 18:21

This is impossible. $.Ajax calls will always return immediately. You need to deal with the return when it is called through a callback (possibly several seconds later). Javascript never blocks for a given call. It may help to think of your code like this:

 //This entirely unrelated function will get called when the Ajax request completes
 var whenItsDone = function(data) {
   console.log("Got data " + data); //use the data to manipulate the page or other variables
   return data; //the return here won't be utilized
 }

 function myFunction(){
   $.post(postURL, mydata, whenItsDone);
 }

If you're interested more on the benefits (and drawbacks) of Javascript's no-blocking, only callbacks: this Node.js presentation discusses its merits in excruciating detail.

score 0 · Answer 2 · answered Aug 29 '12 at 14:51

function myFunction(){
   var deferred = new $.Deferred();

   var request = $.ajax({
      url: postURL,
      data: mydata
   });

   // These can simply be chained to the previous line: $.ajax().done().fail()
   request.done(function(data){ deferred.resolve(data) });
   request.fail(function(){ deferred.reject.apply(deferred, arguments) });

   // Return a Promise which we'll resolve after we get the async AJAX response.
   return deferred.promise();
}

JQuery $.post in a function. Wait for callback to define the return.

2 Answers2

Linked