How can I store the result of an AJAX query in a pre-declared variable?

Question

$("#btn").click(function() {
    var data;
    getData();
    // use data...
}

function getData() {
    $.ajax({
        // Usual AJAX key-value pairs...
        success: function(response) {
            // Set data = response
        }
    });
}

How can I store the response to the AJAX request in the data variable declared in the handler function?

I want to use the value returned by the server inside the handler function.

Is there a way I can do this without disabling asynchronous retrieval.

You could work with a callback. That would give you the variable when the ajax request is done, but I don't know if that's what you would want? — Douwe de Haan, Mar 16 '17 at 15:00
@Exception_al: and you are correct with the duplicate flag! Callum Messiter: Read the link Exception_al posted and you will have your solution! — Douwe de Haan, Mar 16 '17 at 15:07

score 0 · Answer 1 · answered Mar 16 '17 at 15:10

Based on what you are asking, you could do the following, but I would suggest running your logic inside of the callback itself, as Javascript will not wait for the ajax response to complete before moving on within the function.

var getData = function( callback ) {

    $.ajax({
        success: function( response ) {

            callback( response );

        }
    });

};

$('#btn').on('click', function(evt) {

    var data;

    getData(function(response) {
        data = response;

        //you should use data here

    });

});

How can I store the result of an AJAX query in a pre-declared variable?

1 Answers1