skip to Main Content

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


  1. 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.

    Login or Signup to reply.
  2. This seems like the image would just be cached in your browser. Check out this post for preventing caching Here

    from the link above:

    header("Cache-Control: no-store, no-cache, must-revalidate, max-age=0");
    header("Cache-Control: post-check=0, pre-check=0", false);
    header("Pragma: no-cache");
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search