Geek Answers Handbook

JQuery.ajax () local variable cannot be assigned global

I have jjery ajax code:

$(document).ready(function() { var global_arr = new Array(); $.ajax({ url: 'result.php', type: 'post', dataType: 'json', success: function(data) { $.each(data, function(key, value) { global_arr.push(value.name); }); alert(global_arr); //get correct value, works fine } }); //end of ajax function alert(global_arr); //get null, it doesn't work properly });

Pay attention to the lines to warn global_arr, why can't I get the value from the $ .ajax () function? Thank you, someone will help with this.

+6
source share
4 answers

Ajax takes time to complete. The execution of the function does not take much time. Thus, by the time you get your warning outside of the ajax request, the ajax request is still using the time to complete (either in the transfer or in the server-side actions).

You can always wait for the ajax method to complete.

 $(document).ready(function() { var global_arr = new Array(); var complete = false;//flag to wait for ajax completion $.ajax({ url: 'result.php', type: 'post', dataType: 'json', success: function(data) { $.each(data, function(key, value) { global_arr.push(value.name); }); alert(global_arr); //get correct value, works fine complete = true;//mark ajax as complete } }); //end of ajax function (function runOnComplete(){ if( complete ){//run when ajax completes and flag is true alert(global_arr); }else{ setTimeout(runOnComplete,25);//when ajax is not complete then loop } })() });

However, the most common way is to call back.

 $(document).ready(function() { function runOnComplete(){//code executes once ajax request is successful alert(global_arr); } var global_arr = new Array(); $.ajax({ url: 'result.php', type: 'post', dataType: 'json', success: function(data) { $.each(data, function(key, value) { global_arr.push(value.name); }); alert(global_arr); //get correct value, works fine runOnComplete();//callback } }); //end of ajax function });
+6
source

Ajax is asynchronous. When the JS engine reaches your idle alert () line, the AJAX call has not yet received a response from the server and has not set a variable.

This is why internal warning () works. It starts when the response comes from the server.

+5
source

because alert(global_arr); //get null, it doesn't work properly alert(global_arr); //get null, it doesn't work properly until $.ajax

0
source

My suggestion here was to split it into 3 funcitons, so that would make a little more sense. You will need ajax, handelRequest, onComplete. You can also add an error handler to your ajax function, so if that happens, it can do this without blocking the script for the user.

 $(document).ready(function () { var global_arr = new Array(); $.ajax({ url: 'result.php', type: 'post', dataType: 'json', success: handelRequest(data), error: handleError }); function handelRequest(data) { $.each(data, function (key, value) { global_arr.push(value.name); }); onComplete(global_arr); //get correct value, works fine } function onComplete(global_arr){ // then here you can do what ever you // you would like with the array alert(global_arr); } function handleError(){ // gracefully fail } })
0
source

More articles:


All Articles