重复jQuery Ajax调用

Question

I have multiple check boxes for users to select and based on selected checkboxes i need to make a jquery ajax call. For that i used FOR loop to iterate through selected elements array and sent ajax request for each checkbox. Each request takes more than 5-10 minutes. In current scenario it calls all ajax request simultaneously.

I want to call next ajax calls only after finishing earlier ajax request.

Is there any solution for this?

Answer 1

You can make recursive calls.

function sendAjax(id) {
        var checkbox = $('input[type=checkbox]:eq('+id+')','#formid');
        if(checkbox == undefined)
             return;
        $.ajax({
            type: 'POST',
            dataType: "json",
            url: 'url',
            data: { },
            success: function (data) {
                  sendAjax(id+1);
            },
            error: function (data) {
                alert(data.responseText);
            }
        });
    }
    sendAjax(0);

Answer 2

Iterate in your readyStateChange method instead of in the for loop.

    ...
    array_index++;
    var data = selected_elements[array_index];
    if (data) {
        send_ajax_request(data);
    }
}

Answer 3

That is kind of against the whole point of ajax. The first "a" is usually considered to mean "asynchronous", but you want to make the request synchronous (async = false I believe in jQuery)

Answer 4

Using recursive call, until previous ajax request not finished, next request cant be processed. So recursive call can solve the problem of these ajax request.

var queue_element = ["a","b","c","d","e","f","g"];
var execute_queue = function(i){    
  $.ajax( {    
    url: queue_element[i],
    success: function({
    i++;    // going to next queue entry

    // check if it exists
      if (queue_element[i] != undefined){
        execute_queue(i);
      }
    }
  }); // end of $.ajax( {...

}; // end of execute_queue() {...

var index = 0;

execute_queue(index); // go!