Question

I am trying to access variable ‘dimensions’ in my ajax response but not able to get it. I dont want to make this variable global. Following is my code

  $(document).ready(function(){
  $('#submittext').click(function(){
   var dimensions;
   $.ajax({
     type: "GET",
     url: "bin/getcontentsize.php",
     data: findContentsize,
     success: function(response){
       //want to access dimensions here to assign response and some calculation(but not able to access it)
     }
     });
   //so i can use here
  });
  });

Answer 1

In this case you can access the dimensions variable from both the ajax call back and the code immediately after starting the ajax request. The variable is accessible in both of these contexts.

What is most likely causing the problem though is the timing. The success method will run asynchronously after the ajax request is completed. It’s best to view this as executing later. However the code immediately after the $.ajax call will execute immediately. Hence you won’t see any effects from the success handler on the dimensions variable when it runs.

If there is code you want to run with the value of dimensions as calculated by the success method you need to call that code from the success callback. For example

$('#submittext').click(function(){

   var handleNewDimensions = function (dimensions) {
     // Code that used to be after the $.ajax line
   }

   $.ajax({
     type: "GET",
     url: "bin/getcontentsize.php",
     data: findContentsize,
     success: function(response){
       var dimensions = doTheCalculation(...);

       // Call the code which needs to deal with the new dimensions
       handleNewDimensions(dimensions);
     }
   });