Выполнение 2 асинхронных запросов AJAX, один за другим

Question

Во-первых, я знаю, что название, похоже, противоречит самому себе.

Однако проблема заключается в том, что я хочу либо вызвать 2 функции AJAX один за другим, либо позвонить только вторым.

Позвольте мне поместить это в контекст .. Я пишу приложение «хранилище хранилища». По умолчанию все результаты загружаются в алфавитном порядке. Пользователь может ввести свой адрес или почтовый индекс в поле и нажать «Поиск». Затем мое приложение найдет координаты широты и долготы с их использованием с использованием API геокодирования Google, а затем передаст эти координаты в мой собственный вызов AJAX, который затем закажет результаты на основе их местоположения, ближайшего магазина в первую очередь.

Однако, если пользователь не вводит почтовый индекс, я хочу просто вернуться к умолчанию и показать результаты в алфавитном порядке еще раз.

До сих пор ...

function generateResults(_postcode) { 
     //console.log("generating results"); 
     if (readyState) { 
      changeReadyState(false); 
      jQuery.ajax({ 
       url: "http://maps.googleapis.com/maps/api/geocode/json?address=" + encodeURIComponent(_postcode) + ",UK&sensor=false", 
       success: function(d){ 
        var _u = ajax_url; 

        if (d.results && d.results[0] && d.results[0].geometry && d.results[0].geometry.location) { 
         var location = d.results[0].geometry.location; 
         _u = appendQS(_u, "lat=" + location.lat); // Appends as query string, putting either ? or & before 
         _u = appendQS(_u, "lng=" + location.lat); 

         jQuery.ajax({ 
          url: _u, 
          success: function(data){ 

           changeReadyState(true); 
          }, 
          error: function(){ 
           changeReadyState(true); 
          }, 
          async: false 
         }); 
        } 
        else if (d.error_message) { 
         alert(d.error_message); 
         changeReadyState(true); 
        } 
        else { 
         alert("No results found for '" + _postcode + "'"); 
         postcodeTxt.val(""); 
         changeReadyState(true); 
        } 

       }, 
       error: function(){ 
        changeReadyState(true); 
       } 
      }); 
     } 
     else { 
      //console.log("Application busy, try again soon"); 
     } 
    } 

Я полагаю, я мог бы просто иметь два случая в зависимости от того, _postcode пуст или нет, но это будет означать повторение кода.

В принципе, я хочу только обратиться к API геокодирования Google, если поле _postcode не пустое, но я хочу, чтобы этот вызов либо не выполнялся, либо закончился, прежде чем я позвоню своему AJAX.

Я взглянул на то, чтобы сделать первый запрос синхронным, но, согласно документам jQuery, он устарел, и вместо этого они рекомендуют использовать их успешные/ошибки/полные обратные вызовы.

У меня такое чувство, что это немного поздно в тот же день!

Приветствия

Answer 1

Попробуйте что-то вроде:

$.when(
    $.get('path1', function(d1) { 
     // do stuff with first request data 
    }, 'datatype') 
).then(function() { 
    $.get('path2', function(d2) { 
     // do stuff with second request data 
    }, 'datatype') 
}, function(o,e,m) { 
    // handle errors 
}); 

Вы даже можете сделать больше, чем просто Ajax звонки, если вы хотели.