3

Como esperar o retorno de um ajax para continuar a requisicao de outro? Tenho o seguinte:

    $.ajax({
        type: "GET",                                
        url: 'http://uma_url_qualquer.com',
        success: function (e) {
            var item = f.items; 
           //AQUI A OUTRA CHAMADA
            $.ajax({
                 type: "GET",                               
                 url: 'http://uma_url_qualquer.com',
                 success: function (f) {
                 }
           });
          //AQUI TERMINA          
        }
    }); 

Do jeito que esta as duas executam ao mesmo tempo e da erro. Tentei usar async mas ja esta obsoleto e trava meu navegador! Como resolver?

3
  • 3
    Como tens no código é uma opção válida. O que não funciona nesse modelo?
    – Sergio
    Commented 28/09/2016 às 20:34
  • Uso um valor pego na primeira para usar na segunda. Mas do jeito que esta a primeira executa toda e so depois a segunda executa.
    – Thiago
    Commented 28/09/2016 às 20:42
  • 4
    É correto que uma só executa depois da outra e é possivel usar dados da primeira na segunda, mas não o contrário. Uma coisa que não percebo é porque tens var item = f.items; antes da segunda chamada quando f é um argumento da segunda e não da primeira.
    – Sergio
    Commented 28/09/2016 às 20:44

2 Respostas 2

3

Você pode criar uma promessa, pode usar o then para executar o proxímo ajax.

Exemplo:

function meuAjax() {
  return $.ajax({
    type: "GET",
    url: 'https://httpbin.org/get',
    success: function(e) {
      console.log('Executou 1');
    }
  });
}

meuAjax().then(function() {
  $.ajax({
    type: "GET",
    url: 'https://httpbin.org/get',
    success: function() {
      console.log('Executou 2');
    }
  });

})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>

Pergunta relacionada: Ajax/JQuery - Como saber se uma requisição foi concluída?

Detalhe muito importante, você esta usando o retorno do segundo ajax no primeiro, e isto não é possível, sendo assim o var item = f.items; é acessível apenas no segundo ajax.

1
  • 2
    Promises são uma boa opção (talvez melhor que a do AP) mas não vejo que seja o problema aqui.
    – Sergio
    Commented 28/09/2016 às 20:45
2

Tente executar em sequencia utilizando $.when:

  $.when(
    $.ajax({ // Primeira a ser executada
    url: 'http://uma_url_qualquer.com', 
    type: 'GET',      
    success: function(data){     
            resultado1 = data;                  
    }           
  }); 

  $.ajax({ // Segunda a ser executada
    url: 'http://uma_url_qualquer.com', 
    type: 'GET',      
    success: function(data){                          
        resultado2 = data;     
    }           
  }); 

  ).then(function() {
    $('#div1').html(resultado1);
    $('#div2').html(resultado2);
  });
0

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .