I searched my answer online but with no luck. I have posted on their support forum, no luck either. I have also searched in their documentation, to try to find some info about setting up the progress bar, but found nothing useful. Can someone point me in the right direction. I need to be able to reset the progress to zero, between the two file uploads, and animate the bar again on the second file upload. Thank You.
3 Answers
you can set the progress bar width back to 0 (instead of 100%) in your done
Callback:
done: function (e, data) {
setTimeout(function() {
$('#progress .progress-bar').css('width',0);
}, 1500);
...
}
..I'm using setTimeout to give the bar some time to "transition" to its "done" state and remain there for a bit before receding back.
-
1Thank you! This should be the accepted answer. Worked using jQuery File Upload Plugin Version 5.31 out of the box. Jan 28, 2014 at 23:42
-
If you upload multiple files at once, the "done" callback will be invoked by each file. The progress bar would then start fluctuating.– dlg_Jul 10 at 20:17
-
Thanks @dlg_ for the comment . It's been so long since I worked with this, but I wonder if there is a 'global done' or something along those lines.– D.TateJul 11 at 21:23
I use the following code to solve this issue, I have to say it works very well.
$(document).ready(function() {
$('#fileupload').click(function(){
$('#progress .progress-bar').css('width', 0);
$('#progress .progress-bar').html('');
});
});
I use callback feature like this:
$('#fileupload').bind('fileuploadalways', function (e, data) {
$('#progress .progress-bar').css('width',0);
});
Also see Callback Options