Ajax 调用输出到全局变量

Question

How to assign the output of ajax call to a global variable so that the output can be used outside the ajax call?

var filterarray=new Array();
$.ajax({
            type: "GET",
            url: uri,
            dataType : "json",
            contentType : "application/json",           
            data: {
                input:filtervalue
            },  
            cache: false,
            success : function(response) {
                filterarray = response;
                console.log(response);

                });
            },
            error: function(error) { 
                console.log(error);
            }
            });
    }

Answer 1

Let's say you have this simple example from ajax documentation:

$.ajax({
  url: "test.html",
  context: document.body
}).done(function() {
  $( this ).addClass( "done" );
});

As you see adding the context sets this reference within all callbacks:

The this reference within all callbacks is the object in the context option passed to $.ajax in the settings; if context is not specified, this is a reference to the Ajax settings themselves.

You could also just append your variable to window .

Answer 2

You can assign the value to a global variable just like anywhere else in the code.

var value;

$.ajax().done(function(responseValue) {
    value = responseValue;
});

Although the problem is that this code is asynchronous and you if you try to access the value before call completes, for example right after $.ajax block, the value will be undefined. The jQuery $.ajax call returns an implementation of Promise, so it's a much better practice to do:

var ajaxPromise = $.ajax(...);
// ...

// here you want to access value form ajax call:
ajaxPromise.done(function(value) {
    // do something with value
});

The great thing about promises is that you can call .done multiple times and it will always resolve with the value , even if it was already used before.

Answer 3

Try this:

var result; 
$.ajax({ 
       type: "POST", 
       async: false, 
       url: url, 
       data: postdata, 
       dataType: "json", 
       success: function (data) { 
       result= data; 
   } });
result = jQuery.parseJSON(result);

Here async:false is used to store ajax return value to the global result variable.

Let me know these code snippets works or not.

Answer 4

Ajax is asynchronous. So response may get after the code execution.

var filterarray=new Array();
$.ajax({
            type: "GET",
            url: uri,
            dataType : "json",
            contentType : "application/json",           
            data: {
                input:filtervalue
            },  
            cache: false,
            success : function(response) {
                filterarray = response;
                // do what ever you want to do with response here.



                });
            },
            error: function(error) { 
                console.log(error);
            }
            });
    }

Answer 5

function getJson(url) { return JSON.parse($.ajax({ type: 'GET', url: url, dataType: 'json', global: false, async:false, data: { filter:value }, success: function(data) { return data; } }).responseText); }

Above piece of code solved my issues