Uploaded image disappears in Chrome

I have this weird situation where an uploaded image file disappears only when using Chrome.

This is how it happens: I click Choose Files and upload an image

Uploaded image disappears in Chrome

Then when I click Choose Files then I click cancel or close the window, the recently uploaded file disappears.

Uploaded image disappears in Chrome

I tested the same page using Firefox and Safari, and it works fine,

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

Then when I click Choose Files then I click cancel or close the
window, the recently uploaded file disappears.

This is something that it does by default. It’s all because of the Chrome browser design.

You can add the following js code to change it design, add onclick and onchange event to this upload file input control:

Upload Image:
<input id="imageUpload" type="file" onclick="fileClicked(event)" onchange="fileChanged(event)">


@section Scripts{
    <script>
     
        var clone = {};
        function fileClicked(event) {
            var fileElement = event.target;
            if (fileElement.value != "") {
                clone[fileElement.id] = $(fileElement).clone(); //'Saving Clone'
            } 
        } 
        function fileChanged(event) {
            var fileElement = event.target;
            if (fileElement.value == "") {
                clone[fileElement.id].insertBefore(fileElement); //'Restoring Clone'
                $(fileElement).remove(); //'Removing Original'
            } 
        }
    </script>

}

Here is the test in Chrome:

Uploaded image disappears in Chrome


All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

0 0 votes
Article Rating
Subscribe
Notify of
guest

0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x