Как средствами jquery blueimp реализовать последовательную загрузку файлов из очереди по нажатию на кнопку?

Question

[miskusi]

Вопрос частично пересекатеся с toster.ru/q/23881. Имеется https://github.com/blueimp/jQuery-File-Upload. Есть несколько инпутов, в которых можно выбрать файл.По выборе файла он просто добавляется в некую очередь. По нажатию на кнопку 'загрузить все' необходимо выполнить загрузку файлов на сервер.
Написано нечто такое

var allImages=[];
 $('.fileupload').fileupload({                
                //async:false,//it work fine, but in ie 8-9 do not work                
                fail: function (e, data) {alert('hi ie8');},
                done: function (e, data) {/**/},
                add: function (e, data) {                    
                    allImages.push(data);
                }
            });

$('#start_uploads').click(function () {
    for (var i = 0; i < allImages.length; i++) {
                    var data = allImages[i];
                    data.submit();
                }
            allImages = [];
// Здесь код начинает выполняться, не дождавшись окончания сабмита всех файлов
    return false;
});

Проблема в том что сабмиты выполняются асихронно и код после allImages = []; начинает выполнятся не дождавшись окончания сабмитов.

async:false помогает, но только не в ie8-9 где нет поддержки xhr и в итоге файрится коллбэк fail.Можно конечно по событию always для текущего выполнять сабмит для следующего, искусственно реализовав последовательное выполнение, а для последнего файла в always вызывать код, который должен выполняться после сабмита всех файлов, но подход не очень.

Как сделать такую загрузку синхронно?
Есть еще статейка возможно о чем то похожем https://github.com/sstur/jquery-file-upload/wiki/H..., но для устаревшей версии плагина.

Answer 1

[miskusi]

Помог совет из связанного вопроса: можно заюзать deferred объекты. Единственный нюанс, тк у нас не чистый вызов $.ajax() необходимо создать свое deffered поведение (habrahabr.ru/post/112960)
Получаем нечто вроде

var allImages=[];
var dfd= $.Deferred();
 $('.fileupload').fileupload({                               
                add: function (e, data) {                    
                    allImages.push(data);
                },
                always: function (e, data) {                   
                    countUploadedFiles++;
                    if (countUploadedFiles === needed) {
                        dfd.resolve();
                    }
                }
            });

$('#start_uploads').click(function () {
    $.when(uploadAllImages())
             .then(function () {
                    // some code
             });
    return false;
});
function uploadAllImages() {
        for (var i = 0; i < allImages.length; i++) {
            allImages[i].submit();            
        }
        allImages = [];
        return dfd.promise();
    }