forループの終わりにアクションを実行する

Question

forループが終了した後にページをリダイレクトしようとしましたが、forループの前にコードを実行していてもforループの前に実行しています。 JavaScriptでforループが行われた後にコードを実行して別のページにリダイレクトする方法があるのだろうかと思っています。これは私のコードです。

$('#submit').click(function(e) { 
    e.preventDefault(); 
    var total = $('#total').val(); 

    for (var i = 0; i < total; i++) { 
    if ($('#check_' + i).is(':checked')) { 
     // The string to be posted to the submit file 
     var dataString = 'month=' + month + '&year=' + year + '&patient_id=' + patient_id; 

     // AJAX code to submit form. 
     $.ajax({ 
     type: "POST", 
     url: "pages/views/payroll/bulk_payroll_functions.php", 
     data: dataString, 
     cache: false, 
     success: function(result) { 
      alert("good"); 
     } 
     }); 
    } 
    } 
    alert("All members payrolls made"); 
    window.location = ("index.php?lang=en&page=view_payroll"); 
}) 

Answer 1

コードは期待通りに機能しています - AJAXリクエストが行われています。 ただし、は非同期なので、リダイレクトする前に完了しているとは限りません。

これを行う最もクリーンな方法は、$.ajaxが返す約束を使用することです。あなたは、すべてのAJAX要求が完了したときにリダイレクトするように$.whenを使用することができます

：

$('#submit').click(function(e) { 
    e.preventDefault(); 

    // array to store the promises 
    var promises = []; 

    var total = $('#total').val(); 

    for(var i = 0; i < total; i++){ 
    if($('#check_' + i).is(':checked')){ 
     // The string to be posted to the submit file 
     var dataString = 'month=' + month + '&year=' + year + '&patient_id=' + patient_id ; 

     // AJAX code to submit form. 
     promise = $.ajax({ 
     type: "POST", 
     url: "pages/views/payroll/bulk_payroll_functions.php", 
     data: dataString, 
     cache: false, 
     success: function (result) { 
      alert("good"); 
     } 
     }); 

     // add ajax request to the promises 
     promises.push(promise); 
    } 
    } 

    // redirect when all promises have resolved 
    $.when(promises).then(function() { 
    alert("All members payrolls made"); 
    window.location = ("index.php?lang=en&page=view_payroll"); 
    }); 
});