How to use variable outside my ajax success

Question

The aim is to get the values from the ajax call function;

Below is the code I have tried to get the value from the ajax success function and use it for another function, where I draw a box over image using SelectAreas function.

Code:

$.ajax({
    type: 'GET',
    url: 'getfile.php',

    data: {
        'file': file,
    },

    success: function(data) {
        console.log(file);

        // value [2324106109]

        var value = data.split(",");
        console.log(value[0]) // 23
        console.log(value[1]) // 24
        console.log(value[2]) // 106
        console.log(value[3]) // 109
  

    $('#img01').selectAreas({
        onChanged: debugQtyAreas,
        maxAreas: 1,
        areas: [{
            x: value[0],
            y: value[1],
            width: value[2],
            height: value[3],
        }],
        parent: $('#myModal'),
    });
}
});

In the above code, the console.log prints the values successfully, but when I tried to use those values inside my SelectAreas function, I could not access the values of value[0],value[1],value[3],value[4].

I am not sure where I am making a mistake. Can someone help me fix this issue and help me to get the values of value[0], value[1], value[2] and value[3] inside the selectareas function

Answer 1

The easy way I guess, is just to create a let data = null , above ajax, then in success: assign the value. for the instance:

 let neededData;

 $.ajax({
   type:'GET',
   url: 'getfile.php',

   data:{
     'file':file,

   },

   success: function(data){
 
     neededData = data.split(",");

   $('#img01').selectAreas({
     onChanged: debugQtyAreas,
     maxAreas:1,
     areas: [
                            {
                                x: neededData[0],
                                y: neededData[1],
                                width: neededData[2],
                                height: neededData[3],
                            }
                        ],

       parent: $('#myModal'),

   });
  }
 })