1

複数の AJAX 呼び出しを使用してテーブルを作成する必要がある状況にあります。私は ajax リクエストを作成し、要素の配列 (5 としましょう) を持つ JSON オブジェクトを取得します。for ループを介して実行し、各 ajax 要求の応答で、現在のループ要素と現在の ajax 呼び出しからのデータの一部を使用して行を作成し、それをテーブルの行に追加します。（私の悪い文法でごめんなさい）

遅延オブジェクトを使用してこれを実装する方法を知りたいですか? 私の理解が正しければ、これは遅延オブジェクトを使用して実装するのがより簡単になるはずですか? 正しい？

私の現在の実装

$.ajax{
    //options
    success : function(data){

    // add col1, col2, col3 from first ajax call
        $(data).each(function(i,e){
            
            // make ajax request based on inputs from current loop element
            $.ajax({
                //options
                success: function(data) {
                    // add col5, col6 from first ajax call
                    // add col7, col8 from current loop element
                    // add <tr> to the table
                }
            });
            
        });
    
    }
}
4

1 に答える 1

2

DOMを更新する前に、すべてのajax呼び出しが返されるまで待ちますか？これを行う必要がない場合は、$。Deferredを使用せずに済ませることができます。それぞれの「成功」コールバックでDOMを更新するだけです。

すべての呼び出しが戻るまで待ちたい場合は、次のようにすることができます。

var promises = [];

$(data).each(function(i,e){

  // make ajax request based on inputs from current loop element
  promises.push($.ajax({ 
    // stuff 
  }));

});

$.when(promises).done(function() {
  // Update the DOM
});

私はこれを試したことがないので、構文エラーが発生する可能性がありますが、ajax呼び出しは「約束」を返すという考えです。これは本質的に、将来のある時点で、その義務を果たすという約束です。したがって、すべてのPromiseを配列にプッシュし、$。when関数を使用して、すべてのPromiseが実行されたときにコードを実行できます。

于 2012-10-30T13:38:45.403 に答える