2016-03-19 13 views
1

Şu anda bir JS/Jquery uygulaması geliştiriyorum ve bir sorunla karşılaştı.Yinelemeli ajax ekleme çiftleri hata ayıklama/çözme nasıl?

Senaryo Bir dizi kimlik alan bir sınıfa sahibiz. Ve bir Parse.com Veritabanına bir Ajax çağrısı yapmanın kendisi. Oluşturulduktan sonra, bazı verileri (Kimlik, İsim, ...) listesine ekler, listenin yeni bir kimliğini açar ve dizide daha fazla ID bulunana kadar arama yapar. Sonuç, tüm derleme nesnelerinin bir listesini içeren bir DIV'dir. İşte

sorun liste bazen elemanları çoğaltmak sahip olmasıdır Problem

function classSomething(ListOfIds,...){ 
var aListId= ListOfIds.pop(); 
$.ajax({ 
    url: '<secret URL to Parse Database>' + aListId, 
    dataType: 'json', 
    async : true, 
    success: function(response) { 

     this.id = response.id; 
     this.name = response.name; 
     this.address = response.Address; 

     ... 

     var innerHTML = '<li><div class="aclassObject">'+ this.id + ... + '</div></li>'; 

     $('#TheList').append(innerHTML) 

     if(ListOfIds.length >0){ 
       new classSomething(ListOfIds,...) 
     } 

    } 
} 

Sözde Kanununda Sınıf olduğunu. Ne yazık ki JS hata ayıklama, zamanın% 100 mükemmel çalışır, ancak normal olarak çalıştırıldığında "rastgele" çiftleri olacaktır.

cevap

0

Her yinelemeli çağrının tekil bir dizi ids olacağı şekilde tüm kopyaları kaldırmak için böyle bir şey deneyin. Sorguyu çözüp çözmediğimi belirttiğim filtre ifadesini alabilirsin, ama benim tahminim, tüm çağrıların asenkron doğası sorunu yaratan şey.

Peki ya bir ajax çağrısı diğerine göre biraz daha uzun sürüyorsa? Her zaman eşit olmadığı için, kimliğine sahip olmayan bir kişiyi gönderebilirsin, ama bir öncekinin geri dönüşünü alabilirsin, onu geri vereceksin (hiçbir şeyi kaldırmamışsın). İşte bazı sahte kodlar, belki de fikirleri kıvılcım.

function request(id) {  

    // return the AJAX promise 
    return $.ajax({ 
     url: '<secret URL to Parse Database>' + id, 
     dataType: 'json', 
     async : true 
    }); 
} 

function sendTheRequest(ids,....) { 
    // you probably don't need this filter if you go the promise route 
    const id = ids.filter(function(item, pos) { 
       return ids.indexOf(item) == pos; 
       }) 
     return request(id).then(function(response){ 
      // deal with your returned data 
      // conditional. if still 'ids', do recursive, call again 
       if(ids.length) sendTheRequest(ids,...) 
     }); 
} 

function putAllIds(ids){ 
    return sendTheRequest(ids); 
} 

putAllIds().done(function(res) { 
    console.log(res); 
}