Multiple file upload issue

[ruchisheth]

Prerequisites

• I have searched for similar issues in both open and closed tickets and cannot find a duplicate.
• The issue still exists against the latest master branch of bootstrap-fileinput.
• This is not an usage question. I confirm having read the plugin documentation and demos.
• This is not a general programming / coding question. (Those should be directed to the webtips Q & A forum).
• 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. set multiple true
   2 click browse button and select files
   3 click browse button again and select different files again

Expected behavior and actual behavior

When I follow those steps, I see...

If set multiple files to true for control and clicking browse button for more than one time, then it shows thumbanails for all selected files but only uploads last selected files

Environment

Browsers

• Google Chrome
• Mozilla Firefox
• Internet Explorer
• Safari

Operating System

• Windows
• Mac OS X
• Linux
• Mobile

Libraries

• jQuery version:
• bootstrap-fileinput version:

Isolating the problem

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

[kartik-v]

Can you share a JS fiddle to see what you are configuring and your expected outcome?

[Bhoft]

I guess this is normal, because for multiple file upload only new added files should be uploaded.
If ajax upload is enabled the files could be uploaded in between each "browse + add".

When i follow his steps i only see thumbnails of the last added files. Which is correct in my opinion. Because if every file is added to the widget when selected in browse to the has to be uploaded files list there is no possibility to "delete" them from the list. Because the delete button is only visible for already uploaded files.

I have another issue regarding multiple files upload. Which i guess could have something to do with this issue (maybe something was changed in the meantime to fix this issue)

I have also a multi upload widget (but without ajax upload)

I have these filesnames "file1.pdf", "file2.pdf" , "file3.pdf", "file4.pdf".

e.g. i have added these 3 files though browse to an empty upload
"file1.pdf", "file2.pdf" , "file3.pdf"
All 3 files are shown in the preview.
But I added those 3 files by mistake and wanted to add the files 2, 3 and 4.
So i click browse select those files and add them.

But what happens only the "file 4" is shown in the preview.

So it looks like that the js which renders the widget doesn't add the others.

Other test i add "file1.pdf", "file2.pdf" , "file3.pdf" to an empty widget.
And add the same files again. No file is then in the preview (and also not uploaded). The widget is empty.
Only after adding the files a 3rd time the files are visible in the preview and uploaded.

I guess there is somewhere a check if some file is already added and permitted if added again.

This could be easily checked here by trying to upload the same files again
https://jsfiddle.net/7z01jb07/7/

[Bhoft]

The problem why this i mentioned above is caused that in the _change function the tfiles = [] variable is set to empty while the fileIds = self._getFileIds() is set with the fieldids of already added files.

So the same filename wouldn't be added again even if it wasn't uploaded yet.
But how can this be fixed?

[kartik-v]

e.g. i have added these 3 files though browse to an empty upload
All 3 files are shown in the preview. But I added those 3 files by mistake and wanted to add the files 2, 3 and 4. So i click browse select those files and add them. But what happens only the "file 4" is shown in the preview.

It is an expected occurrence. There is been some validation thought put here in the plugin. If you are using without ajax upload (it means you are using native HTML file input)... where you cannot append files -- file input is read only and will always store the latest file you selected (which means it will overwrite previous selection). Read docs for the usage modes and what is possible and not.

[Bhoft]

@kartik-v yes thats correct, this is what @ruchisheth thought which is an issue.

But try the fiddle which I have linked above and add some files. Then click browse and select the same files again.
Result will be tFiles = [] and no files will be uploaded, which is wrong.

I don't want to append files. I just click browse and select the same files a second time. Or some additional files because i had forgot to select a relevant file.

[kartik-v]

I will update over this

[kartik-v]

Is resolved now.

[Bhoft]

perfect
tested it successfully

[pinalkothiya]

@kartik-v i am facing the same issue in "kartik-v/bootstrap-fileinput": "@dev" version please help to fix it.

[vince83110]

Same issue for me, I understand it's the normal behaviour for the HTML field (without ajax). But the problem is that you add the number of files each time we open the file explorer, I mean, I select 2 files, it will show "2 files selected" in the input, then I go look for other 3 files for example, it will show "5 files selected", but only the last 3 will be uploaded.

I will try to look for a workaround.