다른 요청의 데이터에 따라 달라지는 Ajax 요청

Question

두 번째 아약스 요청에서 첫 번째 데이터를 사용할 수 있도록 다른 (.then)을 사용하여 아약스 요청을 중첩하려고합니다. 이 경우 두 번째 아약스 요청 (지도 좌표) 첫 번째 아약스 호출 좌표를 사용하고 싶습니다. 변수는 latt 및 long입니다.

$(document).ready(function(){ 

    $('#submitWeather').click(function(){   
     var city= $("#city").val(); 
     var latt, long;    
     if(city !=''){     
      $.ajax({     
       url:'http://api.openweathermap.org/data/2.5/weather?q=' + city + "&units=metric" + "&APPID="....", 
       type: "GET", 
       dataType: "jsonp", 
       success: function(data){ 
        console.log(data);      
        var widget = show(data); 
        $("#show").html(widget);     
        latt = coord.lat; 
        long = coord.lon;      
       } 

      }).then($.ajax({ 

       url:'https://maps.googleapis.com/maps/api/js?key="..."&callback=initMap', 
       type: "GET", 
       dataType: "jsonp", 
       success: function initMap() { 
       var uluru = {lat: +latt+, lng: +long+}; 
       var map = new google.maps.Map(document.getElementById('map'), { 
       zoom: 4, 
       center: uluru 
      }); 
     var marker = new google.maps.Marker({ 
      position: uluru, 
      map: map 
     }); 
     }   
    }); 
    }else{     
     $("#error").html("<div class='alert alert-danger text-center'> The field cannot be empty, please enter a city! </div>"); 
    } 
}); 
}); 

Answer 1

두 번째 ajax 호출을 함수로 간단하게 감싸고 첫 번째 호출이 성공하면 호출하십시오.

 

    function secondajaxcall(latt, long){ 
    /** your second ajax call **/ 

    } 
    function firstajaxcall(){ 
    $.ajax({ 

      XXXXXXXX, 

       success: function(data){ 
        latt = data.lat; 
        long = data.long; 
        secondajaxcall(latt, long); /* CALL SECOND FUNCTION **/ 
       } 

      }) 


    } 
    firstajaxcall();