user3422637 user3422637 - 1 month ago 18
Ajax Question

How to return data from ajax success function?

In my front end JavaScript application, I make an ajax request to fetch data from the server. As soon as I get the data, I want to return that piece of information to the view.

var view_data;
$.ajax({
url:"/getDataFromServer.json",
//async: false,
type: "POST",
dataType: "json",
success:function(response_data_json) {
view_data = response_data_json.view_data;
console.log(view_data); //Shows the correct piece of information
return view_data; // Does not work. Returns empty data
}
});

// return view_data; --> Keeping the return outside of the ajax call works but then I need to make my ajax call synchronous in order for this return clause to be executed after the ajax call fetches data.


How would I do this?

Answer

Instead of returning data from success: pass data to a function.

var view_data;
$.ajax({
    url:"/getDataFromServer.json",
    //async: false,
    type: "POST",
    dataType: "json",
    success:function(response_data_json) {
        view_data = response_data_json.view_data;
        console.log(view_data); //Shows the correct piece of information
        doWork(view_data); // Pass data to a function
    }
 });

function doWork(data)
{
    //perform work here
}