How to store return on Ajax request in a variable

0
  

I tried the following code but it does not work

    function getCategoria(id){
        var categoria;

        $.ajax({
            url: "../control/anuncio/index.php",
            data:{
                 method: 'get_categoria',
                 id_categoria: id
            },
            method: "post",
            dataType: "json",
            success: function(retorno){
                 categoria = retorno.categoria;
            }
        });

       return categoria;
    } 
    
asked by anonymous 12.02.2018 / 03:07

2 answers

0

Ajax is an asynchronous function, so the program will not expect to execute ajax to then return its variable category. But luckily we can make the ajax function synchronous by adding the async property to false :

function getCategoria(id){
    var categoria;

    $.ajax({
        url: "../control/anuncio/index.php",
        data:{
             method: 'get_categoria',
             id_categoria: id
        },
        method: "post",
        dataType: "json",
        async: false,
        success: function(retorno){
             categoria = retorno.categoria;
        }
    });

   return categoria;
}

In this way, the return categoria; line will only be executed after finishing the request.

    
12.02.2018 / 03:21
1

Ajax works asynchronously, that is, the request is sent and the rest of the code continues to run.

To capture and display the return value of the request, it is necessary to add these functions within% success%.

function getCategoria(id){
    $.ajax({
        url: "../control/anuncio/index.php",
        data:{
             method: 'get_categoria',
             id_categoria: id
        },
        method: "post",
        dataType: "json",
        success: function(retorno){
             exibeMensagem(retorno.categoria);
        }
    });
} 

function exibeMensagem(msg) {
    alert(msg);
}

Another way is to add the callback option. Ex:

$.ajax({
        url: "../control/anuncio/index.php",
        async: false,
        data:{
             method: 'get_categoria',
             id_categoria: id
        },

But there is a problem. Current browsers display the alert:

  

Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check link .

The reason? This will soon be removed and you will not be able to use it. According to the API specification itself ...

  

Synchronous requests are in the process of removing the web platform as it has detrimental effects to the end user experience.

     

Developers should pass false to the asynchronous argument when the current global object is a async:false, . Users are strongly encouraged to warn about such use in development tools and may generate the exception Window

Of course they will not remove from one to another, however the ideal is to suit as soon as possible. So it is recommended that you create another function to handle the return of the request (as shown in the first example) .

    
12.02.2018 / 03:16