2016-07-31 10 views
0

私は、AjaxリクエストをトリガーするJQueryの各ループを持っています。すべてのajax呼び出しが実行された後、1つの成功メッセージを表示したい。私のコードは以下になりJQueryですべてのajax呼び出しが完了すると、各ループは完了しますか?

$('.container input:checked').each(function() { 
    json_data = $(this).parent().parent().find('.case_json').html() 
    $.ajax({ 
    type: "POST", 
    url: "/some_action", 
    data: { json_data : json_data }, 
    success: function(data) { 
     console.log('saved') 
    } 
    }) 
}).promise().done(function(){ $('#import_message').show().addClass('alert alert-success').html('Data imported successfully!') }); 

しかし、コードの問題は、AJAX呼び出しが実行行われる前に、私の成功メッセージが道を表示なっているです。

私は間違っていますか?または、私が実装した方法を変更する必要がありますか?

+1

jQueryを使用している場合は、 'jquery.when()'を使用してください。 –

+0

私の推測は、現在のところ、最初のリクエストが終了するとすぐに約束を返し、成功メッセージを実行します。 –

+0

多分、https://github.com/caolan/asyncが必要です – slorenzo

答えて

0

あなたが現在のように、それがどのように見えるべきかで、$ .whenでの使用の$ .MAP機能を結合する必要があります:地図機能がdefferedsの配列を作成します

$.when.apply($, $('.container input:checked').map(function() { 
    json_data = $(this).parent().parent().find('.case_json').html() 
    return $.ajax({ 
    type: "POST", 
    url: "/some_action", 
    data: { json_data : json_data }, 
    success: function(data) { 
     console.log('saved') 
    } 
    }) 
})) 
.done(function(){ 
    $('#import_message').show().addClass('alert alert-success').html('Data imported successfully!') 
}); 

、この配列は、$ .whenにpasssedされます問題は、引数として配列をサポートしていませんが、任意の数のパラメータをサポートしているため、約束事の配列を引数として引数に渡す.apply()を使用できることです。

+0

チャームのように働いた! –

関連する問題