Return data in post ajax is not working

Question

I am trying to retrieve data using $.post and store it as a return type. However, I always get an undefined error.

if I do something like:

function get_list(){
      $.post('php/reverse.php', function(data){
        alert(data);
      });
  }

everything works perfectly. But if I do something like

 function get_list(){
          $.post('php/reverse.php', function(data){
            return data;
          });
      }

alert(get_list());

Then it suddenly gives me an undefined error. Can someone tell me what I am doing wrong.

consider scope. You're telling your anonymous function to return data, but the function containing this post call returns nothing. — Kai Qing, Apr 11 '13 at 21:14
Take into consideration that the `get_list` function returns before the anonymous callback function even starts executing. The `get_list` function returns undefined because it never hits a `return` statement during its execution. The `return data` statement is inside the callback function, and is not executed as part of the `get_list` function. The callback function is executed after the asynchronous POST request completes (but the code that calls it does not care what it returns). — tcovo, Apr 11 '13 at 21:21

score 4 · Answer 1 · answered Apr 11 '13 at 21:15

4

You cannot return such data in an asynchronous context...

you have to pass some callback which is executed on success:

function get_image_list(handler){
     $.post('php/reverse.php', function(data){
         handler(data);
     });
}

get_image_list(function(data){alert(data);});

answered Apr 11 '13 at 21:15

bwoebi

23,637
5
58
79

Great! Works perfectly fine! – kuwame Apr 11 '13 at 21:19

score 1 · Answer 2 · answered Apr 11 '13 at 21:18

Your get_image_list does not actually return anything, as it does not contain a return-statement. The AJAX-call is performed asynchronously. For your snippet to work as expected, it would have to look something like:

function get_image_list(callback) {
    $.post('php/reverse.php', function(data){
        callback(data);
    });
}

get_image_list(function(data) { alert(data); });

score 0 · Answer 3 · answered Apr 11 '13 at 21:15

0

This is because of the asynchronous nature of AJAX. You can't return a value from a callback function because all other code has long executed by the time the AJAX call fires the callback.

answered Apr 11 '13 at 21:15

Steve

8,609
6
40
54

score 0 · Answer 4 · answered Apr 11 '13 at 21:26

This is not ideal, but it seems you're not familiar with asynchronous calls yet. Please investigate callbacks. Having said that, this is the code you're looking for:

function getList(){
    var dataToReturn;
    $.ajax({
        url: "php/reverse.php", 
        async: false
    }).done(function(data){
        dataToReturn = data;
    });
    return dataToReturn;
}

alert(getList());

By setting async to false, you're forcing the code to wait until the data is ready to be used. That way you'll be able to assign to 'dataToReturn', and the return it at the end of the function's execution. By default, async is true, so the execution arrives to the end of the function before the data is ready, and therefore there is nothing to return.

Return data in post ajax is not working

4 Answers4