等待几个ajax调用完成,然后做一些事情

时间:2016-01-26 16:42:49

标签: javascript ajax

我有这个:

$("#grid tbody tr").each(function () {
    saveRow(model));
});

getAllRows();
...

方法saveRow类似于:

$.ajax(
{
    type: 'POST',
    contentType: 'application/json',
    url: "myUrl",
    data: JSON.stringify(model),
    success: function (data) {
        whatever();
    }
});

发生的情况是,我想为已更改的每个网格行调用saveRow并保存它,当它们全部保存时,请调用getAllRows函数。

目前正在发生的事情是,当我致电getAllRows时,并非所有saveRow都已完成,导致数据返回一半,一半未更改。

如何确保仅在getAllRows为网格中的每一行完成后调用saveRow

修改

以下是有关当前实施的更多详细信息:

// ajax function to save individual row
function saveRow() {
    $.ajax(
    {
        type: 'POST',
        contentType: 'application/json',
        url: "myUrl",
        success: function (data) {
            whatever();
        }
    });
}

// array to store ajax functions called
var requests = [];

// function that iterates through all rows and saves them
$("#grid tbody tr").each(function () {
    // adding the ajax function call to the array
    requests.push(saveRow());
});


...

// supposedly, call getAllRows when all the saveRow ajax calls are done
$.when.apply($, requests).then(function () {
    getAllRows();
});

这不起作用,getAllRows在所有其他完成之前被调用

3 个答案:

答案 0 :(得分:3)

ajax函数将为您提供一个promise对象。如果您将这些承诺传递给JQuery $.when函数,它将返回另一个承诺,当您通过的每个承诺将解决时,它将解决:

var promise1 = $.ajax({ /* your saveRow ajax */});
var promise2 = $.ajax({ /* your saveRow ajax */});

$.when(promise1, promise2).done(function(promise1, promise2) {
    getAllRows();
});

如果您有多个safeRow ajax等待,您还可以使用apply函数为when函数提供一系列承诺:

var promises = [];
promises.push($.ajax({ /* your saveRow ajax */}));
promises.push($.ajax({ /* your saveRow ajax */}));
//...

$.when.apply($, promises).done(function() {
    getAllRows();
});

答案 1 :(得分:0)

你可以用像

这样的承诺做点什么
var d1 = $.ajax({...});
var d2 = $.ajax({...});

$.when(d1, d2 );
.then(function() {
    ...
})

答案 2 :(得分:0)

如果异步功能不起作用 - 您可以尝试使用变量作为条件,即

如果要调用10个saveRows,请将全局变量设为saveRowsRun = 0。 在每个SaveRow函数的末尾设置saveRownsRun ++ 让函数getAllRows()在每个saveRows函数的末尾运行,但在if语句中运行;

if(saveRownsRun == 10){
    getAllRows();
}

这样可以确保在每一行之后尝试触发,但只能在最后一行之后触发。