I have a simple HTML file upload input:
<input name="ImageFile" id="imageInput" type="file" accept=".jpg, .jpeg" />
I want to allow the same file name to be uploaded in a row. For example,
First I upload an image, and then I see it displayed and decide it’s not how I like it so I open it up in photoshop (or another photo editor) and I make some changes. Now I want to re-upload it.
With this current input field I can not do that. I must either:
a.) change the name
or
b.) have a way to clear the input field before reuploading
What I want to happen is to have the upload field clear the existing file thus allowing the same file to be uploaded without conflict. Or if HTML has an attribute that allows the same file to be uploaded again (and have the updated changes that were made in photoshop).
I do not want my users to manually clear the input by pressing an x button for several reasons.
Note: I can not clear the file input on pop up of the select box because if they press cancel it will still remove the image. I know I can avoid this by saving the image before removing it but this seems like a very ugly hack.
Can anybody help me out with this? Is there a simple hack/work-around or is this not possible?
2
Answers
Last time I used a file upload field, I was able to just hit F5, re-submit the form when prompted by the browser, and it would upload the file with changes applied.
So it sounds like you’re doing something more than just a “simple” file upload. If you’re listening for
onchange
, consider calling.reset()
on it after successful upload to clear it out.This seems like the image would just be cached in your browser. Check out this post for preventing caching Here
from the link above: