延迟 data.submit() 与 blueimp 文件上传的进度

Question

我有一个情况，我必须先保存表单 - 获取一个id - 上传的文件将与该id相关。

我工作正常 - 但到目前为止，我无法从data.submit();获得任何进度数据.

可能吗？

这是我的代码：首先在挂起列表中收集数据对象：

var pendingList = [];
$('#fileupload').fileupload({
dropZone: $('#drop-area'),
uploadTemplateId: null,
downloadTemplateId: null,
url: multi_upload_action,
autoUpload: false,
add: function (e, data)
{
$.each(data.files, function (index, file)
{
var row = $('<div class="template-upload">' +
'<div class="table-cell">' +
'<div class="name">' + file.name + '</div>' +
'<div class="error"></div>' +
'</div>' +
'<div class="table-cell">' +
'<div class="size">Processing...</div>' +
'</div>' +
'<div class="table-cell">' +
'<div class="progress" style="width: 100px;"></div>' +
'</div>' +
'</div>');
// fetching formatted size;
var file_size = formatFileSize(file.size);
row.find('.size').text(file_size);
data.context = row.appendTo($(".content_upload_download"));
});
pendingList.push(data);
},
limitConcurrentUploads: 1,
maxChunkSize: 8388000
});

然后 - 稍后 - 发送带有额外信息的文件：

sendAllFiles = function (id, redirect_action)
{
var total_files = pendingList.length;
var n = 0;
pendingList.forEach(function (data)
{
data.formData = {id: id};
data.submit()
.done(function (data, status)
{
n++;
$.each(data.files, function (index, file)
{
if (typeof file.error != 'undefined' && file.error)
{
alert(file.name + ': ' + file.error);
}
});
if (n == total_files)
{
window.location.href = redirect_action;
}
});
});
};

问候

Answer 1

找到了一个适合我的解决方案：

1. 在添加时为每个文件创建隐藏的开始按钮
2. 提交主表单，并接收额外信息
3. 将新信息附加到文件上传实例的 url
4. 遍历所有"开始"按钮并启动单击事件
5. 在上次上传完成后重定向页面

sendAllFiles = function (id)
{
$('#fileupload').fileupload(
'option',
'url',
phpGWLink('index.php', {menuaction: 'helpdesk.uitts.handle_multi_upload_file', id: id})
);
$.each($('.start_file_upload'), function (index, file_start)
{
file_start.click();
});
};
$('#fileupload').fileupload({
dropZone: $('#drop-area'),
uploadTemplateId: null,
downloadTemplateId: null,
autoUpload: false,
add: function (e, data)
{
$.each(data.files, function (index, file)
{
var file_size = formatFileSize(file.size);
data.context = $('<p class="file">')
.append($('<span>').text(data.files[0].name + ' ' + file_size))
.appendTo($(".content_upload_download"))
.append($('<button type="button" class="start_file_upload" style="display:none">start</button>')
.click(function ()
{
data.submit();
}));
pendingList++;
});
},
progress: function (e, data)
{
var progress = parseInt((data.loaded / data.total) * 100, 10);
data.context.css("background-position-x", 100 - progress + "%");
},
done: function (e, data)
{
file_count++;
var result = JSON.parse(data.result);
if (result.files[0].error)
{
data.context
.removeClass("file")
.addClass("error")
.append($('<span>').text(' Error: ' + result.files[0].error));
}
else
{
data.context
.addClass("done");
}
if (file_count === pendingList)
{
window.location.href = redirect_action;
}
},
limitConcurrentUploads: 1,
maxChunkSize: 8388000
});