Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Storing ajax response array into a variable for later usage

Hi I need to store an AJAX Response into two variables x and y or into a array. My AJAX response is a array. I am able to see the data but only with and alert into che call. I need the data outside the ajax call

var x;
var y;

$.ajax({
    url: 'ajaxload.php',
    dataType: "json",
    success: function (data) {
        x = data.posX;
        y = data.posX;
        alert(x + " " + y);  // I can se data but I need outside ajax call
    }
});
like image 402
Micky Avatar asked Oct 22 '12 12:10

Micky


People also ask

How do I save AJAX response to global variable for reuse?

var myResponse; $. ajax({ url: 'PageMethod/GetData', method: 'post', dataType: 'json', data: JSON. stringify({ dataId: "xxx" }), contentType: 'application/json', success: function (data) { myResponse = data.

How can I get specific data from AJAX response?

You can't as it's asynchronous. If you want to do anything with it, you need to do it in a callback. How? Because it's asynchronous, javascript will fire off the ajax request, then immediately move on to execute the next bit of code, and will probably do so before the ajax response has been received.

How do I return a response from AJAX?

What you need to do is pass a callback function to the somefunction as a parameter. This function will be called when the process is done working (ie, onComplete): somefunction: function(callback){ var result = ""; myAjax = new Ajax.

How do I return data after AJAX call success?

You can store your promise, you can pass it around, you can use it as an argument in function calls and you can return it from functions, but when you finally want to use your data that is returned by the AJAX call, you have to do it like this: promise. success(function (data) { alert(data); });


2 Answers

you can store the ajax response in a global array for further use in other javascript function

var ajaxResult=[];

$(document).ready(function(){

  $.ajax({
    url: 'ajaxload.php',
    async:true,
    dataType: "json", 
    success: function(data)
     { 
        ajaxResult.push(data);
     }
  });
});

otherJsfunc()
 {
  console.log(ajaxResult); 
 }
like image 110
Always Sunny Avatar answered Oct 13 '22 00:10

Always Sunny


If I understand correctly, you want to reuse the ajax response later within your code. If that's the case, your current code wouldn't work because by default, the javascript engine doesn't wait for the response of ajax requests. In other words the code below won't work:

<script type="text/javascript">
$(document).ready(function(){
    var x; 
    var y;
    $.ajax({
        url: 'ajaxload.php',
        dataType: "json", 
        success: function(data) { 
            x= data.posX;
            y= data.posX;
            alert (x+" "+y);  // I can se data but I need outside ajax call
        }
    });
    alert(x+" "+y); // You won't see anything, because this data isn't yet populated. The reason for this is, the "success" function is called when the ajax request has finished (it has received a response).
})
</script>

You need to wait for the ajax response. To do that with jQuery you need to slightly modify your code:

<script type="text/javascript">
$(document).ready(function(){
    var data = $.parseJSON($.ajax({
        url:  'ajaxload.php',
        dataType: "json", 
        async: false
    }).responseText); // This will wait until you get a response from the ajax request.

    // Now you can use data.posX, data.posY later in your code and it will work.
    var x = data.posX;
    var y = data.posY;
    alert(x+" "+y);
    alert(data.posX+" "+data.posY);
});
</script>
like image 27
tftd Avatar answered Oct 13 '22 00:10

tftd