How to get data from ajax call?

Question

I am trying to get data from ajax call by cross domain. Here is code

function GetMaxWULen() {
var x;
$.ajax({
    url : url,
    method : 'POST',
    jsonp : "callback",
    async : false,
    data : {
        Function : "GetMaxWULen",
        Authorization : Base64.encode(login + ":" + token),
        WuType : $("#ddlWUType").val()
    },
    dataType : 'jsonp',
    crossDomain : true,
    error : function(request, status, error) {
        alert('nie udało sie');
        alert(error);
    }
}).done(function(result) {
    console.log('done result');
    x = result;
    console.log(x);
});
console.log('function end');
console.log(x);}

At the end of the function, x variable is undefined but in done event value is correct. Could anyone can help me or tell what is wrong in this code?

It's asyncronous, so that last line of code is executed before the request loads, therefore `x` doesn't have a value yet. It works in the `done` event because that waits for the request to load before executing the function. — Joe Simmons, Oct 30 '13 at 11:25
above error: add `success:YourfunctionName()`, later then `YourfunctionName(response ){alert(response)}` — Satinder singh, Oct 30 '13 at 11:26
possible duplicate of [How to return the response from an AJAX call?](http://stackoverflow.com/questions/14220321/how-to-return-the-response-from-an-ajax-call) — Rory McCrossan, Oct 30 '13 at 11:27
Please use the search feature. This question has been asked hundreds of times. — Rory McCrossan, Oct 30 '13 at 11:27

Guilherme Sehn · Answer 1 · 2013-10-30T12:31:19.740

3

This happens because your AJAX request is done asynchronously. It means the rest of your code won't wait your response be ready to continue.

If you need to use the data returned from AJAX outside your function, you might want to create a parameter to serve as a callback when the response is ready. For example:

function yourFunction(callback) {
    $.ajax({
        /* your options here */
    }).done(function(result) {
        /* do something with the result here */
        callback(result); // invokes the callback function passed as parameter
    });
}

And then call it:

yourFunction(function(result) {
    console.log('Result: ', result);
});

Fiddle: http://jsfiddle.net/9duek/

edited Oct 30 '13 at 12:31

answered Oct 30 '13 at 11:28

Guilherme Sehn

6,727
18
35

but when I call function as You suggest and add return result to that call it still not work. – dawid Oct 30 '13 at 12:27
Edited the answer and added a working example at jsfiddle. If this is not working, you may have some problem in another part of your code. – Guilherme Sehn Oct 30 '13 at 12:31
You didn't get the idea. As your response is asynchronous, you *can't* return it. Put the code that will manipulate your response inside the callback passed to `myFunction` – Guilherme Sehn Oct 30 '13 at 13:06

score -2 · Answer 2 · answered Oct 30 '13 at 11:24

try

$.ajax({
    url : url,
    method : 'POST',
    jsonp : "callback",
    async : false,
    data : {
        Function : "GetMaxWULen",
        Authorization : Base64.encode(login + ":" + token),
        WuType : $("#ddlWUType").val()
    },
    dataType : 'jsonp',
    crossDomain : true,
    error : function(request, status, error) {
        alert('nie udało sie');
        alert(error);
    }
}).success(function(result) {
    var datareturned = result.d;
    console.log('done' +  datareturned);
    x = datareturned;
    console.log(x);
});

Maybe if you'd explained what you'd done then people wouldn't have to ask. He really only needs a simple example of why this async call was not acting in a synchronous manner, as that's obviously what his problem is. — Reinstate Monica Cellio, Oct 30 '13 at 11:45

How to get data from ajax call?

2 Answers2