I have this method:

function getUserName(guid) {
    var name = "Unbekannt";

    $.getJSON(urlCurrent, {
        "method" : "get_user_info",
        "guid" : guid,
        "auth_token" : temporaryAuthToken
    }, function(data) {
        if (data.status == 0) {
            alert(data.result[0].name);
            name = data.result[0].name;
        }
    });

    return name;
}

Nearly all is working: the Ajax-Request gets data and fires the callback-function, so that

alert(data.result[0].name);

shows a popup with this value: "Forename Surname"

But then at

return name;

the method returns "Unbekannt", although name should have the new value "Forename Surname". What happened and where´s the mistake?

Thx a lot

I have this method:

function getUserName(guid) {
    var name = "Unbekannt";

    $.getJSON(urlCurrent, {
        "method" : "get_user_info",
        "guid" : guid,
        "auth_token" : temporaryAuthToken
    }, function(data) {
        if (data.status == 0) {
            alert(data.result[0].name);
            name = data.result[0].name;
        }
    });

    return name;
}

Nearly all is working: the Ajax-Request gets data and fires the callback-function, so that

alert(data.result[0].name);

shows a popup with this value: "Forename Surname"

But then at

return name;

the method returns "Unbekannt", although name should have the new value "Forename Surname". What happened and where´s the mistake?

Thx a lot

• javascript
• jquery
• ajax
• callback
• getjson

• 1 The call to getJSON is asynchronous. So, at the return name; the data probably won't have arrived yet. – Lee Taylor Commented Aug 29, 2012 at 14:22

3 Answers 3

I would return the promise object from the function and act on it.

function getUserName(guid) {
    return $.getJSON(urlCurrent, {
        "method" : "get_user_info",
        "guid" : guid,
        "auth_token" : temporaryAuthToken
    });
}

getUserName(guid).done(function(data) {
    if (data.status == 0) {
        alert(data.result[0].name);
    }
});

And, if you wanted to do the status check up front, .then is good for that.

function getUserName(guid) {
    return $.getJSON(urlCurrent, {
        "method" : "get_user_info",
        "guid" : guid,
        "auth_token" : temporaryAuthToken
    }).then(function(data){
        return $.Deferred(function(def){
            if (data.status == 0) {
                return def.resolve(data);
            }
            return def.reject(data);
        });
    });
}

getUserName(guid).done(function(data) {
    alert(data.result[0].name);
});

When you return name it hasn’t been assigned the new value you got from the getJSON callback yet, since the ajax call is asynchronous and takes some time to plete.

You need to bring a callback function instead:

function getUserName(guid, callback) {
    var name = "Unbekannt";

    $.getJSON(urlCurrent, {
        "method" : "coinor.get_user_info",
        "guid" : guid,
        "auth_token" : temporaryAuthToken
    }, function(data) {
        if (data.status == 0) {
            alert(data.result[0].name);
            name = data.result[0].name;
            callback(name);
        }
    });
}

getUserName(guid, function(name) {
    alert(name);
});

Because return name; is performed before the ajax call has been returned.

If you want it to relate to the data that has been returned in the $.getJSON() call, it needs to be inside the callback function as well.