Is there a big gap between the last file reaching 100% and stop / end events?
I am using the blueimp File Upload plugin to implement some of the file upload functionality and I have noticed that there can be long periods of time between when my last file execution bug reaches 100%, and when events stop and end. I have the following code:
$('#fileupload').fileupload({
dataType: 'json',
progress: function (e, data) {
var progress = parseInt(data.loaded / data.total * 100, 10);
var bar = data.context.children().children(".progress");
$(bar).css("width", progress + "%");
},
add: function (e, data) {
data.context = $("<div></div>").html("Uploading...<div class='progressHolder'><div class='progress'> </div></div>").appendTo($("#files"));
data.submit();
$("#processing").fadeIn();
},
stop: function (e, data) {
$("#uploadFiles").fadeIn();
$("#processing").fadeOut();
},
done: function (e, data) {
$.each(data.result.files, function (index, file) {
idArray.push(file.Id);
});
}
});
Does anyone know why this is happening? How can I make it so that progress bars are counted when / stop is called?
source to share
When you upload a file, the file is first (obviously) uploaded to the server, then the server executes the requested server-side script where you process the file. If the "process file" part of the request is not instantaneous, there will be a delay between reaching 100% and the callback being executed. Latency can also occur if there is network lag.
The progress event only tracks the progress of the download, not the progress of the request.
One solution is to stop your progress bar, say 90%
, and then flip it to 100%
in the executed callback. just multiply data.total
by1.1
progress: function (e, data) {
var progress = parseInt(data.loaded / (data.total*1.1) * 100, 10);
var bar = data.context.children().children(".progress");
$(bar).css("width", progress + "%");
},
source to share