AJAX Çağrısı'nı (POST) Bitir

Question

için bekle Her sekmenin üzerinde farklı bir formun bulunduğu jQuery UI sekmelerini kullanıyorum. Kullanıcı çeşitli veri parçalarına girdikten sonra, tüm sekmeleri sunarak her sekmenin sunucuya zaman uyumsuz olarak gönderilmesini sağlarlar. Bu iyi çalışıyor ve burada sorunum yok. Ancak, bir sorunla karşılaştığım yerde, gönderdiğim son formun tüm diğer mesajların tamamlanmasından sonra gerçekleşmesi gerekiyor. Genel bir fikir şu şekildedir:

postForm(0, "#Form1"); 
postForm(1, "#Form2"); 
postForm(2, "#Form3"); 
postForm(3, "#Form4"); 
$.post('Project/SaveProject', function (data) { 
    $('<div class="save-alert">The current project has been saved.</div>') 
    .insertAfter($('#tabs')) 
    .fadeIn('slow') 
    .animate({ opacity: 1.0 }, 3000) 
    .fadeOut('slow', function() { 
     $(this).remove(); 
    }); 
}); 

postForm işlevi işleme biraz yapar ve daha sonra AJAX $ .post çağrı yapar. Burada yapılan son $ .post ('Project/SaveProject' için) diğer mesajlar tamamlanana kadar beklemelidir. Bunu yapmanın en iyi yolu nedir?

Answer 1

Sadece bu gibi başka hiçbir AJAX sonra işe yapıyoruz varsayarak, yangınlar tüm diğer AJAX POST bitirmek .ajaxStop() olayı kullanabilirsiniz:

postForm(0, "#Form1"); 
postForm(1, "#Form2"); 
postForm(2, "#Form3"); 
postForm(3, "#Form4"); 
$(document).ajaxStop(function() { 
    $.post('Project/SaveProject', function (data) { 
    $('<div class="save-alert">The current project has been saved.</div>') 
    .insertAfter($('#tabs')) 
    .fadeIn('slow') 
    .animate({ opacity: 1.0 }, 3000) 
    .fadeOut('slow', function() { 
     $(this).remove(); 
    }); 
    }); 
    $(this).unbind('ajaxStop'); 
}); 

.ajaxStop() yangınları olduğunda bütün Tamamen çalışan AJAX istekleri, yalnızca bu POST'ların tüm döndürdüğünde, yalnızca eşzamanlı AJAX yeniden kaç tane olduğunu belirlemek için jQuery dahili olarak bir sayı tutar ($.active, jQuery 1.5) başlatır Görevler olağanüstü ... 0 olayına geri döndüğünde bu olay patlar.

Bu yaklaşım, diğer form gönderimlerini aynı anda yapmanıza ve en son formu ASAP yapmanıza olanak tanır.

Answer 2

Callbacks:

bir geri arama almak postForm tanımlayın:

function postForm(ind, id, callback) 
{ 
    // ... 
    $.post(url, function() 
    { 
    // ... 
    callback(); 
    }); 
} 

Ardından aşağıdaki gibi bir şey yapmak. Daha az kodlanmış bir şekilde yazmak için özyinelemeyi kullanabilirsiniz; bu, daha fazla form varsa özellikle yararlı olabilir.

postForm(0, "#Form1", function() 
{ 
    postForm(1, "#Form2", function() 
    { 
     postForm(2, "#Form3", function() 
     { 
      postForm(3, "#Form4", function() 
      { 
       $.post('Project/SaveProject', function (data) { 
        $('<div class="save-alert">The current project has been saved.</div>') 
         .insertAfter($('#tabs')) 
         .fadeIn('slow') 
         .animate({ opacity: 1.0 }, 3000) 
         .fadeOut('slow', function() { 
          $(this).remove(); 
         }); 
       }); 
      }); 
     }); 
    }); 
}); 

Answer 3

ajaxStop ile ilgili sorun, herhangi bir ajax yapıldığında her seferinde patlayacağıdır.

var stack = [] 
postForm(var1, var2){ 
    stack.push(1); 
    //Do postForm stuff 
    stack.pop(); 
    if (stack == undefined){ 
     //Call the last post method 
    } 
} 
postForm(0, "#Form1"); 
postForm(1, "#Form2"); 
postForm(2, "#Form3"); 
postForm(3, "#Form4"); 
$.post('Project/SaveProject', function (data) { 
    $('<div class="save-alert">The current project has been saved.</div>') 
    .insertAfter($('#tabs')) 
    .fadeIn('slow') 
    .animate({ opacity: 1.0 }, 3000) 
    .fadeOut('slow', function() { 
     $(this).remove(); 
    }); 
}); 

Answer 4

Hep o kadar hızlı olmaz tabii

$.ajax({ 
    type: "POST",  
    async: false, 
    url: "", 
    ... 

gibi bir şey kullanarak senkron tüm mesajları yapabiliriz ama eğer sorunu çözmek vermez: Alternatif Buna benzer kendi yöntem yığını uyguluyor $ (document) .ajaxStop bir seçenek değil