jquery async and JSON data

Question

following from javascript jquery and using eval i still could not get jquery to read the data asynchronously.

 data1=[1,2,3,4]

Note: i have included async:true in the below example just to show the difference

Below example return "null"

$(document).ready(function(){

var myArray=[];
myArray=getValues();
alert(myArray);
        function getValues(){
        var result=null;
             $.ajax({
                url: 'data1.html',
                type: 'get',
                dataType: 'json',
                cache: false,
                success: function(data) {result = data;},
                async:true,
                });
            return result;
        };
})

and below example work fine and gives the result in an array i.e [1,2,3,4]

$(document).ready(function(){

var myArray=[];
myArray=getValues();
alert(myArray);
        function getValues(){
        var result=null;
             $.ajax({
                url: 'data1.html',
                type: 'get',
                dataType: 'json',
                cache: false,
                success: function(data) {result = data;},
                async:false,
                });
            return result;
        };
 })

can someone explain how to get the results asynchronously Thanks

possible duplicate of [Return value from ajax call?](http://stackoverflow.com/questions/1632039/return-value-from-ajax-call) — Felix Kling, Apr 13 '11 at 08:55

score 8 · Accepted Answer · edited May 26 '14 at 11:55

I would change it to this ...

$(document).ready(function(){

     function postProcessing(data) {
       var myArray = data;
       alert(myArray);
     }


    getValues();

        function getValues(){
             $.ajax({
                url: 'data1.html',
                type: 'get',
                dataType: 'json',
                cache: false,
                success: postProcessing,
                async:true,
                });
        };
})

score 3 · Answer 2 · answered Apr 13 '11 at 05:46

This should work, as it has worked in mine, but i suggest you not to do it.

<script src="jquery.js"></script>
<script>
$(document).ready(function(){

    /*don't do your stuff here*/
        /*do inside success*/

    function getValues(){
        var result=null;
        $.ajax({
            url: 'phpinfo.php',
            type: 'get',
            dataType: 'json',
            cache: false,
            success: function(data) { if(data != null){ alert(data); } },
        });
        return result;
    };

})
</script>

score 0 · Answer 3 · edited Mar 20 '13 at 05:54

By default, all requests are sent asynchronously. true by default.

If you need synchronous requests, set this option to false. Cross-domain requests and dataType: "jsonp" requests do not support synchronous operation. Note that synchronous requests may temporarily lock the browser, disabling any actions while the request is active.

If you need to ensure that the method always displays the latest data then use cache:false and async:false. Also to avoid timeout/error use success/error/complete callback options.

score 0 · Answer 4 · answered Apr 13 '11 at 04:55

0

first part, the result is returned asynchronously to myArray, but before that, the alert function has already executed because the ajax happened asynchronously. So if you place alert right after "return result", you should see the result.

answered Apr 13 '11 at 04:55

yangqi

673
6
13

when i try success: function(data) {result = data;alert(result);} i can see the results but i need to return that value to myArray for further processing, returning after the ajax call is returning null – Linus Apr 13 '11 at 05:12

jquery async and JSON data

4 Answers4

Linked