Access javascript variable inside ajax success

Question

var flag = false; //True if checkbox is checked
$.ajax({
    ... //type, url, beforeSend, I'm not able to access flag here
    success: function(){
        // I'm not able to access flag here
    }
});

Inside ajax, if I try to access flag it says it is not defined. How can I use it inside ajax function?

Any Idea?

Both flag and ajax is body of a function. Nothing else is present inside that function.

because, flag will be out of scope once the ajax call triggers the success call back. — Rajaprabhu Aravindasamy
– Rajaprabhu Aravindasamy, Commented Jun 9, 2015 at 14:04
@RajaprabhuAravindasamy No, success doesn't magically remove variable from context. Here the flag variable is even not accessible from ajax option so OP is setting it outside of ajax method scope$ — A. Wolff
– A. Wolff, Commented Jun 9, 2015 at 14:14
Where exactly are you defining flag? I did a test and it worked fine. Closures means that if flag and the $.ajax call are at the same scope then flag will be available (and it is). There's some missing code in your question... — fdomn-m
– fdomn-m, Commented Jun 9, 2015 at 14:15
I get the feeling this isn't your actual code. This should work fine jsfiddle.net/djgdggay — CodingIntrigue
– CodingIntrigue, Commented Jun 9, 2015 at 14:16
@GopsAB You misunderstand me. I'm not saying this isn't your own code, I'm saying that the code you posted isn't representative of the problem you describe. — CodingIntrigue
– CodingIntrigue, Commented Jun 9, 2015 at 14:19

drhelado · Accepted Answer · 2020-09-14 08:36:46Z

15

You have access to the variable if you make it by reference. All objects in Javascript are referenced values, just the primitive values aren't (such as: int, string, bool, etc...)

So you can either declare your flag as an object:

var flag = {}; //use object to endure references.

$.ajax({
    ... //type, url, beforeSend, I'm not able to access flag here
    success: function(){
        console.log(flag) //you should have access
    }
});

Or force the success function to have the parameters you want:

var flag = true; //True if checkbox is checked

$.ajax({
    ... //type, url, beforeSend, I'm not able to access flag here
    success: function(flag){
        console.log(flag) //you should have access
    }.bind(this, flag) // Bind set first the function scope, and then the parameters. So success function will set to it's parameter array, `flag`
});

edited Sep 14, 2020 at 8:36

drhelado

336 bronze badges

answered Jun 9, 2015 at 14:10

aemonge

2,3471 gold badge24 silver badges29 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

A. Wolff Over a year ago

You don't need to set context of success callback here. OP commented //type,url,beforeSend, I cannot able to access flag here so this would be the same with bind(this, flag)

TRS7 Over a year ago

Can any of you guys help me out with this problem? stackoverflow.com/questions/49122972/…

Aabid · Accepted Answer · 2015-06-09 14:17:48Z

Here is one way. The beforeSend callback option gives you access to both the jqXHR object and the ajax settings object.

You won't be able to use caturl in the append of error, as it will not be in synch with the request throwing error.

 $.ajax({
    /* url, data ...& other opts*/
    beforeSend:function( jqXHR, settings){
        /* add url property and get value from settings (or from caturl)*/
         jqXHR.url= settings.url;
   },
   /* error to be deprecated in jQuery 1.8 , superseded by "fail" */
   error: function(jqXHR, , textStatus, error){
       var url=jqXHR.url;
     /* replace caturl with url in your append */ 
     $('#showdata').prepend("ERROR : '" + error + "' trying to access: " + url + "</br>");
   }

Collectives™ on Stack Overflow

Access javascript variable inside ajax success

2 Answers 2

2 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related