Clearing HTML FILE object?

[cmayo]

Using a form input object of type="file," anyone know a way to reset that field with Javascript? I have a multi-file upload page and would like to give the user an obvious and easy way to change their mind about uploading a file. They can select the filepath in the input object and delete it, but that's not too obvious.

I've tried having JS set the value of that input to an empty string, but the file object seems to act differently than a regular text input.

Any tips are appreciated

 

[theniteowl]

Once you browse and select a file a link is created to that file. The value that you can access via Javascript is not the entire object and I do not know how you would get rid of the object.
However, the method I used to create a multi-file upload is after a selection is made I would add the file path/name to another DIV with a link beside it to allow deletion of that particular file. At the same time I hide field containing the Browse button for that file object and I use DOM methods to create a new one with a sequential name.

It gets a bit complex when you begin removing files and need to keep track of field names so you know what to look for and process on the next page. I handle it by storing the fieldnames in an array and add/remove them from the array as created/deleted. When the form is submitted I write the fieldnames out to a hidden field separated by commas and in my processing page I just parse out the fieldnames and do the file uploads one by one.


It's hard to think outside the box when I'm trapped in a cubicle.