자바 스크립트에서 여러 비동기 데이터베이스 호출

Question

두 개의 별도 비동기 호출을 수행하는 방법을 알아낼 수 없으며 call1이 call2를 마칠 때까지 기다렸거나, 물건을 찾거나, 콜백을 사용하거나 약속 할 필요가 있다고 생각하지만 그것을 얻지 못한다면 누구나 간단한 설명에 대한 링크를 가지고 있습니까? 또는 누구든지 내 코드를 조정하는 방법을 제안 할 수 있습니까?

나는 코드를 약간 단순화했다.

constructButton이 완료된 후 다음 레코드 만 읽도록하려면 어떻게해야합니까? 여기

function justAfunction(){ 
    var query = "SELECT * FROM trlydp where tdrexr = " + route + " order by tdrseq;"; 
    try { 
     localDB.transaction(function(transaction){ 

      transaction.executeSql(query, [], function(transaction, results){ 
       for (var i = 0; i < results.rows.length; i++) { 

        var row = results.rows.item(i); 

        constructButton(); 
       } 

      }, function(transaction, error){ 
       updateStatus("Error: " + error.code + "<br>Message: " + error.message); 
      }); 
     }); 
    } 
    catch (e) { 
     updateStatus("Error: Unable to select data from the db " + e + "."); 
    } 
} 

function constructButton(){ 

    disabled = false; 

    var query = 'SELECT * FROM trlylp'; 

    //alert(query); 
    try { 
    localDB.transaction(function(transaction){ 

     transaction.executeSql(query, [], function(transaction, results){ 
     alert(results.rows.length); 
     if (results.rows.length != 0) { 
      disabled = true; 
     } 

     }, function(transaction, error){ 
      updateStatus("Error: " + error.code + "<br>Message: " + error.message); 
     }); 
     }); 
    } 
    catch (e) { 
    updateStatus("Error: Unable to select data from the db " + e + "."); 
    } 

} 

Answer 1

내가 아약스와 함께 할 방법하지만 개념은 모두 계속하기 전에 완료해야하는 비동기 작업의 집합에 대한 작동합니다 :

var model = {}; 

function checkLoadsComplete(){ 
    if (model.data0 && model.data1 && model.data2){ 
     //load Complete 
     //do something 
     return true; 
    } else { 
     //not done loading 
     return false; 
    } 

} 

function getData0(){ 
    $.ajax({ 
     url: "http://www.domain.com/data0.json", 
     dataType: "json", 
     complete: function(data){ 
      model.data0 = data; 
      checkLoadsComplete(); 
     } 
    }) 
} 

function getData1(){ 
    $.ajax({ 
     url: "http://www.domain.com/data1.json", 
     dataType: "json", 
     complete: function(data){ 
      model.data1 = data; 
      checkLoadsComplete(); 
     } 
    }) 
} 

function getData2(){ 
    $.ajax({ 
     url: "http://www.domain.com/data2.json", 
     dataType: "json", 
     complete: function(data){ 
      model.data2 = data; 
      checkLoadsComplete(); 
     } 
    }) 
} 

$(document).ready(function(){ 
    if(!checkLoadsComplete()){ 
     getData0(); 
     getData1(); 
     getData2(); 
    } 
}) 

Answer 2

이 달성의 두 가지 방법이 있습니다.

1) 비동기 호출이 완료되면 다른 비동기 호출이 완료 될 때까지 대기해야합니다. 첫 번째 onSuccess()에서 두 번째 함수를 호출하여이 작업을 수행 할 수 있습니다.

2) 첫 번째 호출을 동기식으로 만듭니다. (전혀 추천하지 않습니다) 잠재적으로 GUI 모양을 어둡게 만들 수 있습니다.

function f1(){ 
    $.ajax({ 
     url: "blah blah", 
     dataType: "json", 
     complete: function(data){ 
      // do some action based on result 
      f2(); 
     } 
    }) 
}