Why can't I do .ajax ( return data; )? jQuery

Question

I'm trying to get my function to return the data it got into another function but it doesn't seem to work? How can I get it to return the data?

function playerid(playername) {
    $.ajax({
        type: "POST",
        url: "fn.php?playerid",
        data: "playername="+playername,
        success: function(data) {
            //$("#test").text(data);
            return data;
        }
    });
}

I want to use it in another function like this

showBids(playerid(ui.item.value));




function showBids(playerid) {
    $.ajax({
        type: "POST",
        url: "poll.php?",
        async: true,
        dataType: 'json',
        timeout: 50000,
        data: "playerid="+playerid,
        success: function(data) {

            //.each(data, function(k ,v) {

            //})
            //$("#current_high").append(data);

            setTimeout("getData()", 1000);
        }
    });

possible duplicate of [jQuery: Return data after ajax call success](http://stackoverflow.com/questions/5316697/jquery-return-data-after-ajax-call-success) — Marcel Korpel, Jun 16 '12 at 19:31

zizozu · Accepted Answer · 2012-06-16T19:52:25.873

First of all, your playerid() does not return anything, so what do you want to use? It has only $.ajax() call in it, no return statement (one of the callbacks in $.ajax() has return statement, but see below).

Secondly, JavaScript does some things asynchonously, otherwise every interface element would need to wait to react to user action until the AJAX call returns from the server.

Use event-based approach, by passing callbacks to some functions. Then, after they finish, just call the callbacks passing them the result:

function getplayerid(playername, callback) {
    $.ajax({
        type: "POST",
        url: "fn.php?playerid",
        data: "playername="+playername,
        success: function(data) {
            //$("#test").text(data);
            callback(data);
        }
    });
}

and then use it like that:

getplayerid(ui.item.value, showBids);

(notice function name change since it does not actually return player ID, it gets it and passes it to callback)

score 1 · Answer 2 · answered Jun 16 '12 at 19:32

1

You could try to use syncronous Ajax:

function playerid(playername) {
    return $.ajax({
        type: "POST",
        url: "fn.php?playerid",
        data: "playername="+playername,
        async : false   //making Ajax syncronous
    }).responseText;
}

Otherwise you need to use showBids function as callback:

function playerid(playername, callback) { 
     $.ajax({
        type: "POST",
        url: "fn.php?playerid",
        data: "playername="+playername,
        success: function(data) {
           callback(data);
        }
     });
} 
//Usage
playerid(ui.item.value,showBids);

answered Jun 16 '12 at 19:32

Engineer

47,849
12
88
91

async false is deprecated, should I still use it? any other way? – d123 Jun 16 '12 at 19:37
@user1053408 If you don't want to use it, then only way is to use callback, what I was suggesting in my answer. – Engineer Jun 16 '12 at 19:39
@user1053408 Could you show the link, where mentioned that syncronous ajax is deprecated. – Engineer Jun 16 '12 at 19:41
@user1053408 I hope you would show a link from `Ecmascript standard`.If it is mentioned as deprecated in `jquery` since `1.8` version(which does not exist yet), it does not mean it is deprecated in Javascript :) – Engineer Jun 16 '12 at 19:46

Why can't I do .ajax ( return data; )? jQuery

2 Answers2