Bootstrap FileUpload empty array after clear

Question

You can see the problem here http://bmi.sf.net/test.html.

For exact code I am using, right click on this website and select View source in menu.

I am using Jasny bootstrap fileupload plugin. I have a form in which this plugin is used. The form submits to a php file in which the $_FILES array is manipulated.

In the code above I have used jQuery form plugin to view live preview of form submission. The php is just doing one thing: print_r($_FILES)

It is working great except when the following series of action occurs, the $_FILES array is empty:

• The user selects a file. Shows normal php output.
• Then user clears the form using 'x' button. Shows empty array as expected.
• The user loads a new file. Now the array is empty against expectation.

How to fix this?

If user does not clear form first but loads a new file directly then array is not empty. However every user will not do this so I want to solve the given problem.

Answer 1

Looks like a race condition. The fileupload plugin clears the name of the <input type="file"> and sets an <input type="hidden"> to tell the server the difference between pressing clear or submit without a change in a normal form. However in your case, you don't want this behaviour.

For a quick and dirty fix, always set the name of the <input type="file"> on change.

$('#filep').on('change', function() { $(this).attr('name', 'filep') });