search

LPology / Simple-Ajax-Uploader

Javascript file upload plugin with progress bar support. Works in all major browsers, including IE7+, Chrome, Firefox, Safari, and Opera. No dependencies - use it with or without jQuery.
995 stars 267 forks source link

onProgress multiple file uploads #139

Open ghost opened 8 years ago

ghost commented 8 years ago

please help how to track which file been processed when multiple files get uploaded, always get last selected filename

my code


                var uploader = new ss.SimpleUpload({
                    ...
                    multiple: true,
                    multipart: true,
                    ...

                   onProgress: function (pct) {

                        console.log( this.div ) ;
                        console.log( this.test ) ;
                        console.log( this.test1 ) ;
                        console.log( pct + '%');

                    },

                    onSubmit: function(filename, extension) {

                        var self = this;
                        self.div = document.createElement('div');
                        self.div.setAttribute('data-filename', filename);
                        self.test = filename;
                        this.test1 = filename;

                    },
                    onComplete: function(filename, response) {

                        if (!response) {
                            alert(filename + ' upload failed');
                            return false;
                        }

                        console.log(filename + ' upload finished');
                    }
                });

            }

the output

add:851 <div data-filename=​"Jellyfish.jpg">​</div>​
add:852 Jellyfish.jpg
add:853 Jellyfish.jpg
add:855 0%
SimpleAjaxUploader.min.js?v=1452250195:2 [Uploader] Commencing upload using multipart form
add:851 <div data-filename=​"Koala.jpg">​</div>​
add:852 Koala.jpg
add:853 Koala.jpg
add:855 0%
SimpleAjaxUploader.min.js?v=1452250195:2 [Uploader] Commencing upload using multipart form
add:851 <div data-filename=​"Koala.jpg">​</div>​
add:852 Koala.jpg
add:853 Koala.jpg
add:855 23%
add:851 <div data-filename=​"Koala.jpg">​</div>​
add:852 Koala.jpg
add:853 Koala.jpg
add:855 19%
add:851 <div data-filename=​"Koala.jpg">​</div>​
add:852 Koala.jpg
add:853 Koala.jpg
add:855 78%
add:851 <div data-filename=​"Koala.jpg">​</div>​
add:852 Koala.jpg
add:853 Koala.jpg
add:855 59%
add:851 <div data-filename=​"Koala.jpg">​</div>​
add:852 Koala.jpg
add:853 Koala.jpg
add:855 100%
add:851 <div data-filename=​"Koala.jpg">​</div>​
add:852 Koala.jpg
add:853 Koala.jpg
add:855 100%
add:882 Jellyfish.jpg upload finished
add:882 Koala.jpg upload finished
LPology commented 8 years ago

Do you mean tracking which file is being processed on the client side or server side?

ghost commented 8 years ago

on client side in onProgress event handler