jquery multiple Ajax request

Question

This code snippet allows to drop multiple files dragged into a box. The filereader creates a blob of each file and then EACH file should be send to server using the ajax rq:

$.each( e.dataTransfer.files, function(index, file){
    var fileReader = new FileReader();

    //..generate BLOB from file 


    fileReader.onloadend = (function(file) {                                
        return function(e) {                            
            uploadfilelist.append('&lt;li&gt;' + file.fileName + '&lt;/li&gt;');
            //send every single file to server
            var destfoldername=CURRENTPATH;
            var uploadfilename=file.fileName;

            var fd = new FormData();
            fd.append("param1", destfoldername);
            fd.append("param2", uploadfilename);
            fd.append("param3", blob);

            $.ajax({
                type:"POST",
                url:"url",
                data:fd,
                contentType: false,
                processData: false,             
                beforeSend:function (xhr){ 
                    //custom headers
                },  
                success: function(data, textStatus, jqXHR){

                },
                complete: function(jqXHR){    
                    alert("State after complete: " + jqXHR.statusText);                 
                }           
            });
        };
    })(file);
    fileReader.readAsBinaryString(file);
}

PROBLEM: the server internal crashes when receiving a next blob while not having processed the former one.

I found another Post discussing this: How to make all AJAX calls sequential? A "sequential" Request using async:false is not an option, it would block a whole lot of other things..

SOLUTION: ??? Call ajax forfile1, when call is done, call ajax for file2, ...call ajax for file-n

I would really like to use JQ Deferred (http://api.jquery.com/category/deferred-object/) e.g. as described here: http://api.jquery.com/jQuery.when/

$.when($.ajax(???how to refer to THIS ajax call).done(function(){
//call this ajax for the next file again or use $.ajax(code).then()?
});

I am really sorry, but I do not know how to get it right.

Thanks for any suggestions! h.

No I do not, but I could have a discussion with the one who controls the server, if you had an idea :-) it is an iss one.. — ho.s, Sep 15 '11 at 13:49
My only thought would be to code the server so it can handle doing things more than one at a time. The other thing you can do is nest the successive calls inside the callbacks (so that the next ajax command only gets called upon the success of the first one). If success isn't the only time you'd want to do it, then do it in all the `success:`, `failure:`, `complete:` functions. (Be sure to wrap the next ajax call in a function, so you can just call that function in all the places necessary). — Chris Pfohl, Sep 15 '11 at 14:04

score 0 · Answer 1 · answered Oct 24 '14 at 20:57

you can certainly queue them without a plugin by resolving with the next promise

$.ajax(/*options*/)
.then(function(res) {
  // do something with result
  // call 2
  return $.ajax(/* options */);
})
.then(function(res) {
  // call 3
  return $.ajax(/* options */);
})  // and so on
.fail(function(err) {
  // catch any error from any ajax call
});

this is almost the same thing as nesting the callbacks with the added benefit of readability and the catch all for errors

score 0 · Answer 2 · answered Sep 15 '11 at 13:32

0

Well there is a plugin the queue plugin:

http://plugins.jquery.com/project/ajaxqueue

It's written by John Resig himself.

answered Sep 15 '11 at 13:32

Vince V.

3,115
3
30
45

hm thanks, but the link on the page to the example does not work and i can't find a download or sth., just the link to appenTo()-Company. do you know where i can download the source and if it is free? – ho.s Sep 15 '11 at 13:53
@ho.s I's been outdated. I'm sorry. maybe a recursive function where you do your request after the other ? I found this also: https://gist.github.com/1039247/626f0c8210c8f662011b10b89b89478d58133575 looks like a plugin for 1.6.x – Vince V. Sep 16 '11 at 08:44

jquery multiple Ajax request

2 Answers2