progress only called once, same as progressall

480 views
Skip to first unread message

m.cia...@ceoimage.com

unread,
Mar 18, 2014, 12:04:42 PM3/18/14
to jquery-f...@googlegroups.com
Hey all,

I've been having an odd issue that I cannot seem to find a resolution to with the plugin: the progress callback is only being called once (just like progressall). From what I understand, the progress callback should be called once for each file. Is this incorrect? I am trying to use the plugin in combination with knockoutjs as the rendering engine (though this could be used in any fashion with unrelated data objects). The individual upload progress needs to be dynamically set in the 'progress' callback as a result. Yet I still need to be able to upload multiple files and have single 'add' and 'done' callbacks when for the selected batch of files.

Below is example code on what I'm trying to accomplish. The HTML has little to do with this aside from the file input and the #filecontainer element, since I am not using the default templating engine. Any help on this would be greatly appreciated.

var koThings = new ko.observableArray();
var allThingsProgress = new ko.observable("0%");

var makeThing = function (file) {
   
var thing = {};
    thing
.fileName = file.name;
    thing
.progress = new ko.observable("0%");
};

$
('#filecontainer').fileupload({
    url
: 'some/url/for/uploads',
    dataType
: 'json',
    singleFileUploads
: false,
    add
: function (e, data) {
       
//called only once due to singleFileUploads set to false, and due to the way a selection of files uploaded gets handled by the server and the UI.
        data
.formData = { /*some data for the upload handler on the server*/ };
        data
.context = data.files;
       
//add elements via knockout here for each file in data.files
        data
.files.forEach(function (file) {
            koThings
.push(makeThing(file));
       
});
   
},
    progress
: function (e, data) {
       
//this gets called once, for all of the files. Shouldn't it be called several times, once for each file, at a minimum? Possibly even several times per file? Is this even possible?
       
var progress = parseInt(data.loaded / data.total * 100, 10);
       
//update an element via knockout - here is where the issue lies, as data.context is an array of the files, and there seems to be no handler for the individual file
       
//the below code just gets a single "thing" from the koThings array in a quick way.
       
var thing = ko.utils.arrayFirst(koThings(), function (t) { return t.name == data.name; });
        thing
.progress(progress + "%");
   
},
    progressall
: function (e, data) {
       
//this gets called once as well.
       
var progress = parseInt(data.loaded / data.total * 100, 10);
       
//the below just updates the global progress
       
allThingsProgress(progress + "%");
   
}
   
done: function (e, data) {
       
//also only called once. if singleFileUploads is changed to true as the basic plugin has by default, this gets called multiple times.
       
//Due to server and UI restrictions, this cannot be called multiple times.
       
//process some UI stuff once the selection is done.
   
}
});

m.cia...@ceoimage.com

unread,
Mar 18, 2014, 12:16:06 PM3/18/14
to jquery-f...@googlegroups.com
Oh, my mistake. I forgot that at the end of the 'add' callback, I also am doing a data.submit(); to automatically send the files off once a user adds them. Just thought I would add this since it was left out of the code snippet.
Reply all
Reply to author
Forward
0 new messages