다른 Ajax 함수가 끝난 후 조치 수행

Question

해결책 찾기 : 애플리케이션의 테이블 내용을 업데이트하는 기능이 있습니다. 내가 유사한 기능을 실행하지만,되는 .done 행에 나는 prev_update 함수를 호출 테이블의 행의 내용을 편집 마침 나는 테이블의 행을 업데이트하고있어 다른 함수에서

function prev_update(cli_id){ 
    $("#list").empty(); 
    $("#list").append("<tr><td colspan=11><img src='images/loading.gif' alt=loading title=loading /></td></tr>"); 
    $.ajax({ 
     type  : 'POST', 
     url   : 'json/get.php?t=2&id='+cli_id, 
     dataType : 'json', 
     encode  : true 
    }) 
    .done(function(data) { 
     $("#list").empty(); 
     if ((data)["prev_list"]) { 
      $.each((data)["prev_list"], function(i, val) { 
       $("#list").append(val); 
      }); 
      $("#edit").hide("slow"); 
     } else { 
      $("#list").append("<tr><td colspan=11>&nbsp;</td></tr>");      
     } 
    }); 
}; 

하고, 내가 prev_update() 함수가 다음 버튼 인해를 클릭하여 종료 될 때 기다릴 필요가

$("#prev_mod").on("click",(function(event) { 
    $('#loading_img').css('display','inline'); 
    header_print(); 
    $.ajax({ 
     type  : 'POST', 
     url  : 'json/post.php?mod='+$('#prev_id').val(), 
     data  : $("#form_sog").serialize(), 
     dataType : 'json', 
     encode : true 
    }) 
    .done(function(data) { 
     if ((data)["success"]===false) {  
      $('#form_edit').hide('slow'); 
      prev_update(); 
      $('#edit_'+$('#prev_id').val()).click(); 
     }); 
    }); 
})); 

이 완료되면 내가 업데이트 된 테이블 내용에 버튼을 누르면에 대한 수정을 검토 할 필요가 ... 여기에 코드입니다 버튼이 업데이트중인 테이블에 있습니다. 지연된 개체도 사용하려고했지만 작동하지 않습니다 (아마도 내 오류 일 수 있습니다). 다른 함수에서 사용했기 때문에 prev_update 함수를 편집 할 수 없습니다.

Answer 1

.done 대신 .then을 사용하여 코드를 구성 할 수 있습니다. .then이

테스트하지

을 체인화 할 수 있지만 내부 prev_update()의 모든 작업이 완료 될 때 알고 싶은 경우이

function prev_update(cli_id){ 
    $("#list").empty(); 
    $("#list").append("<tr><td colspan=11><img src='images/loading.gif' alt=loading title=loading /></td></tr>"); 
    $.ajax({ 
     type  : 'POST', 
     url   : 'json/get.php?t=2&id='+cli_id, 
     dataType : 'json', 
     encode  : true 
    }) 
    .then(function(data) { 
     $("#list").empty(); 
     // rest of code 
    }).then(function(data) { 
     if ((data)["success"]===false) {  
      // rest of code 
     }; 
    }); 

Answer 2

처럼 될 수 있기 때문입니다, 당신은 비동기 추적 할 그것을 수정해야 그 안에있는 작전과 약속을 되 찾는 것. 그런 다음 호출자는 반환 된 약속을 사용하여 작업이 완료된 시점을 알 수 있습니다.

따라서 prev_update() 내부에는 두 개의 비동기 작업이 ajax 호출이고 .hide() 애니메이션입니다. 숨기기 애니메이션은 ajax 작업의 완료 핸들러 내부에서 발생합니다. 따라서 .done()을 .then()으로 변경하면 이러한 약속을 묶어서 모든 것이 완료되었을 때 발신자에게 알려주는 단일 약속을 되돌릴 수 있습니다.

jQuery는 어떤 jQuery 애니메이션과도 연결되어있는 약속을 얻을 수있는 .promise() 메서드를 가지고 있습니다. 따라서 우리가 애니메이션에 대한 약속을 얻으면 반환 할 수 있고 부모 약속으로 연결됩니다. 애니메이션이 없다면 아무 것도 반환 할 수 없으며 약속 체인이 계속됩니다.

이 기능은 prev_update()의 기능을 전혀 변경하지 않습니다. 이전에 아무것도 반환하지 않았을 때 완료를 추적하는 약속 만 반환합니다.

function prev_update(cli_id){ 
    $("#list").empty(); 
    $("#list").append("<tr><td colspan=11><img src='images/loading.gif' alt=loading title=loading /></td></tr>"); 
    return $.ajax({ 
     type  : 'POST', 
     url   : 'json/get.php?t=2&id='+cli_id, 
     dataType : 'json', 
     encode  : true 
    }).then(function(data) { 
     var p; 
     $("#list").empty(); 
     if ((data)["prev_list"]) { 
      $.each((data)["prev_list"], function(i, val) { 
       $("#list").append(val); 
      }); 
      p = $("#edit").hide("slow").promise(); 
     } else { 
      $("#list").append("<tr><td colspan=11>&nbsp;</td></tr>");      
     } 
     // return promise if there was one 
     return p; 
    }); 
}; 

그래서, 다음과 같은 다른 코드에서이를 사용할 수 있습니다 : 다음과 같이 작업 할 수

$("#prev_mod").on("click",(function(event) { 
    $('#loading_img').css('display','inline'); 
    header_print(); 
    $.ajax({ 
     type  : 'POST', 
     url  : 'json/post.php?mod='+$('#prev_id').val(), 
     data  : $("#form_sog").serialize(), 
     dataType : 'json', 
     encode : true 
    }).then(function(data) { 
     if ((data)["success"]===false) {  
      $('#form_edit').hide('slow'); 
      prev_update().then(function() { 
       // apply click when everything in prev_update() is done 
       $('#edit_'+$('#prev_id').val()).click(); 
      }); 
     }); 
    }); 
}));