filepreupload event wrong index and undefined fileId when uploading folder

[SebastienGautier]

Prerequisites

• [x] I have searched for similar issues in both open and closed tickets and cannot find a duplicate.
• [x] The issue still exists against the latest master branch of bootstrap-fileinput.
• [x] This is not an usage question. I confirm having read the plugin documentation and demos.
• [x] This is not a general programming / coding question. (Those should be directed to the webtips Q & A forum).
• [x] I have attempted to find the simplest possible steps to reproduce the issue.
• [ ] I have included a failing test as a pull request (Optional).

Steps to reproduce the issue

1. Setup the library with a webkitdirectory input
2. Add the filepreupload event
3. Inspect index and fileId parameters

Demo : https://jsfiddle.net/groseb/Lp2wb8rg/3/

Expected behavior and actual behavior

When I follow those steps, I see the index always the same and the fileId undefined.

I was expecting the index and the fileId to have the correct values.

For context I'm using the event to append a path to the formdata to upload to a given directory. I need the fileId to get its webkitRelativePath and construct the correct path for each file. All I could use now is the previewId which is not practical at all and the size of the file but it's not reliable as I could have two files with the same size.

Thanks for your help

Environment

Browsers

• [x] Google Chrome
• [x] Mozilla Firefox
• [ ] Internet Explorer
• [ ] Safari

Operating System

• [ ] Windows
• [ ] Mac OS X
• [ ] Linux
• [ ] Mobile

Libraries

• jQuery version: any
• bootstrap-fileinput version: 5.5.1

Isolating the problem

• [ ] This bug happens on the plugin demos page
• [ ] The bug happens consistently across all tested browsers
• [x] This bug happens when using bootstrap-fileinput without other plugins
• [x] I can reproduce this bug in a jsbin

[coolblades]

I see similar issue with fileuploaded, the index is wrong. Getting 1 when it should be 0 Looking at the source code, looks i is incremented before the task is executed

$reqDocscontent.find(rec.button).prop('disabled', false).fileinput('destroy').fileinput({ theme: 'bs3', uploadUrl: rec.url, allowedFileExtensions: rec.docTypes, maxFileCount: 1, showPreview: false, captionClass: 'input-sm', browseClass: 'btn btn-primary btn-sm', cancelClass: 'btn btn-default btn-sm', removeClass: 'btn btn-danger btn-sm', uploadClass: 'btn btn-success btn-sm' }).on('filebeforeload', (event, file) => { if (rec.days && moment(file.lastModified).isBefore(moment().startOf('day').subtract(rec.days, 'days'))) { BootstrapDialog.warning(The selected file is more than \${rec.days} days old.); } }).on('filepreajax', (e, formdata, previewId, index) => { formdata.append('modDate', e.target.files[0].lastModified); }).on('fileuploaded', function (event, data, id, index) { var fname = data.files[index].name; var out = '' + 'Uploaded file - ' + fname + ' successfully.' + ''; simpleNotify(out, undefined, 'info', 1500); setTimeout("resetDocs(packet, $('#step-4 .tabbable'));", 500); });

Source code: self._uploadSingle(i, id, true, deferrer); is called at a delay but the i++ is already called, so you get 1 for i when self._uploadSingle is called

if (self.uploadAsync) { i = 0; var pool = self.ajaxPool = tm.addPool($h.uniqId()); $.each(self.getFileStack(), function (id) { pool.addTask(id + i, function (deferrer) { self._uploadSingle(i, id, true, deferrer); }); i++; });

            pool.run(self.maxAjaxThreads).done(function () {
                self._log('Async upload batch completed successfully.');
                self._raise('filebatchuploadsuccess', [fm.stack, self._getExtraData()]);
            }).fail(function () {
                self._log('Async upload batch completed with errors.');
                self._raise('filebatchuploaderror', [fm.stack, self._getExtraData()]);
            });
            return;
        }