Question

Here’s a simple ajax call wrapped in a method.

MyNS.GetStringList = function (successCallback, failedCallback) {
var methodUrl = serverUrl + "/GetStringList";
$.ajax({
    type: "GET",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    url: methodUrl, // Location of the service
    data: {}, //Data sent to server
    beforeSend: function (XMLHttpRequest) {
        //ensures the results will be returned as JSON.
        XMLHttpRequest.setRequestHeader("Accept", "application/json");
    },
    success: successCallback,
    error: failedCallback
});
}

Here’s a method calling the above method.

function GoGetTheStringList() {
        var stringList;
        stringList = MyNS.GetStringList(function (data) { return data.d; }, function (XmlHttpRequest, textStatus, errorThrown) {
            alert("error");
        });

        alert(reasonsDictionary); // THIS IS UNDEFINED!

    }

What’s the proper syntax to make the 1st method return the data.d object?

Thanks as always!
Jon

Answer 1

It can’t really. Ajax calls are asynchronous, which means the method will have returned before the success callback is invoked.

EDIT / Correction: You may be able do it, but you will have to set the jQuery ajax async option to false, which means you will be performing a synchronous call, which means your whole app will be waiting for it to return. It’s best if you pass a callback to your function to be called when success is invoked.

In response to your edit: Yes, it will be undefined, because it is out of context. What you need to do is process your data from inside the callback, because at that point you will know you have it, and because you can’t return data as a result of function A from function B. In your callback you should invoke a function to handle the data you got.

var latestData;
function getStuff(succeeded,failed) {...}
function gotStuff(dataWrapper) {
    latestData = dataWrapper.d;
    doThingsWithStuffData(dataWrapper.d);
}

getStuff(gotStuff, function () { ... });