Ajax Call returns undefined when async is true

Question

have function and it's working when async is false, but I want the same functionality (by which I mean return value) but with async is true .

  function Call(param, proc) {
    var url = "../../DataManager/DataManagment.aspx/DataSelector";
    var ret;
    $.ajax({
        url: url,
        type: "POST",
        datatype: "json",
        data: JSON.stringify({
            "data": param,
            "action": proc
        }),
        contentType: "application/json; charset=utf-8",
        success: function (data) {
            ret = data;
        },
        async: false,
        error: errorFn
    });
    return ret.d;
}

score 1 · Answer 1 · answered Nov 14 '15 at 09:54

Do something like:

 function callServerAsync(){
   $.ajax({
        url: '...',
        success: function(response) {

            successCallback(response);

        }
    });
  }

  function successCallback(responseObj){
     alert(JSON.stringify(responseObj)); // Only applicable to JSON response
   }

score 1 · Answer 2 · answered Nov 14 '15 at 09:57

For async=true; return statement will not serve your purpose. Instead go for some callback like below:

function Call(param, proc, callBackFunc) {
    var url = "../../DataManager/DataManagment.aspx/DataSelector";
    var ret;
    $.ajax({
        url: url,
        type: "POST",
        datatype: "json",
        data: JSON.stringify({
            "data": param,
            "action": proc
        }),
        contentType: "application/json; charset=utf-8",
        success: function (data) {
            ret = data;

            if(typeof callBackFunc == 'function')
            {
                callBackFunc(ret.d);
            }
        },
        async: true,
        error: errorFn
    });

}

And call your function as:

function myCallBackFunc(obj)
{
    alert(obj);
}

//call the actual function like:
Call(param, proc,myCallBackFunc);

score 1 · Answer 3 · answered Nov 14 '15 at 09:58

mate, you problem is :return ret.d;

you should have you return ret.d; inside the success function, otherwise, return ret.d will return immediately no matter you ajax have been success or not, that's why when you force ajax run sync it works, but not when async because that time ret is only defined but not assigned value, check this :

function Call(param, proc) {
var url = "../../DataManager/DataManagment.aspx/DataSelector";
var ret;
$.ajax({
url: url,
type: "POST",
datatype: "json",
data: JSON.stringify({
    "data": param,
    "action": proc
}),
contentType: "application/json; charset=utf-8",
success: function (data) {
    ret = data;
    return ret.d;
},
async: true,
error: errorFn
});

}

That ruins the entire point of making it asynchronous as the program will wait for the function to return the value, which basically makes it synchronous — kabiroberai, Nov 14 '15 at 10:19
brother its not returning any value when i return ret.d in success function. — The Computer Scientist, Nov 16 '15 at 13:53

score 0 · Accepted Answer · edited May 23 '17 at 11:53

You can't return from asynchronous code like AJAX. Instead you need to reconsider your function a littler.

So you either need to use a callback and call it in success function or better just return promise object:

function Call(param, proc) {
    var url = "../../DataManager/DataManagment.aspx/DataSelector";
    return $.ajax({
        url: url,
        type: "POST",
        datatype: "json",
        data: JSON.stringify({
            data: param,
            action: proc
        }),
        contentType: "application/json; charset=utf-8",
        error: errorFn
    });
}

Call(params, process).then(function(data) {
    console.log(data);
});

Thank You So Much Brother , Its Work For Me. – The Computer Scientist Nov 16 '15 at 14:21 — The Computer Scientist, Nov 16 '15 at 14:21

Ajax Call returns undefined when async is true

4 Answers4

Linked