我有两个Ajax请求,each()的第一个内部和每个外部的第二个。问题在于,第一个请求成功内的代码非常重要,应该在第二个Ajax请求之前执行。
执行代码后,第一个Ajax请求被发送到服务器,但是只有在第二个Ajax请求执行后才能成功执行。
执行顺序:
first ajax
second ajax
success of first ajax
success of second ajax
有没有办法让第二个ajax一直等到第一个ajax成功结束之后再执行?
$(document).on("change",
".jsQuestionType",
function() {
// alert("The dropdown has been changed.");
var dropdownList = $(this);
var optionTypeId = $(dropdownList).val();
//get the jsQuestionSection
var question = $(dropdownList).parent().parent().parent();
//get the list of jsQuestionOptions
var questionOptions = $(dropdownList).parent().parent().parent().find(".jsQuestionOptions");
// loop in all questionOptions of the selected question
$(questionOptions).each(function(i, e) {
//alert($(e).find("input.jsInputName").attr("questionOptionsId"));
var optionId = $(e).find("input.jsInputName").attr("questionOptionsId");
$.ajax({
url: "/api/QuestionOptions/" + optionId,
method: "DELETE",
success: function(data) {
$(e).remove();
}
});
});
//End loop
var questionId = $(question).find("input.jsInputName").attr("questionId");
// if (questionOptions.length == 0) {
// create the new option using the value sent by dropdown
$.ajax({
url: "/api/QuestionOptions/" + optionTypeId + "/" + questionId,
method: "POST",
success: function(data) {
alert(data);
var d = data;
}
});
//}
});
答案 0 :(得分:0)
您可以在循环中制作一个请求承诺数组,并在所有先前的命令都解决后,使用$.when
来在循环外调用ajax
var requests = $(questionOptions).map(function(i, e) {
var optionId = $(e).find("input.jsInputName").attr("questionOptionsId");
// return ajax promise
return $.ajax({
url: "/api/QuestionOptions/" + optionId,
method: "DELETE",
success: function(data) {
$(e).remove();
}
});
}).get();
$.when.apply($, requests).then(function(){
// all the above requests completed
// do next request
})