Reset file uploader on form reset

Wappler General Bugs
#1

I have a file uploader in a form. When I submit the form I reset it as well, but the file uploader field retains the last uploaded file. I tried setting the field to “” in the success event but that didn’t work either.

#2

In the success event did you set the input value to “” or the name itself? maybe you could show your code for that or a share a link to the page.

In JS it would be something like so we just need to replicate this idea with the onSuccess setValue AppConnect steps

document.getElementById("yourFileUploadInput").value = "";

EDIT: Just for information i normally use custom file upload field for easier styling.

#3

dmx-on:success=“file_featured.setValue(’’)”
dmx-on:success=“file_featured.setValue(”")"
dmx-on:success=“file_featured.setValue(NULL)”
dmx-on:success=“file_featured.setValue(var_file_reset.value)”

None of those work, and I just noticed it’s actually throwing an error inputFile.js:44 Can not set value of a file input! even though set value is an option in the Actions panel.

image

#4

You can’t set the value of file fields due to security restrictions of the browser.

You can just call the reset action of the whole form.

#5

I have called the reset action of the whole form. It doesn’t reset the file upload.

#6

Hmm seems setting to empty value should work normally:

@patrick will investigate why this is not happening in App Connect.

For now maybe you can try some of the jquery/js methods described in the stackoverflow post

#7

Thanks for the pointer.

I got it working after a bit of trial and error by using the static server success on the form like so…

onsuccess="$('#file_featured').replaceWith($('#file_featured').val('').clone(true));"

Any variation of setting the field to empty or null didn’t work but answer #3 in that link pointed me in the right direction. Oddly, I couldn’t set a function in the onsuccess. It just didn’t run. This works for now though and hopefully there will be a proper fix soon.

Thanks

1 Like
#8

Hello,
We just tested this with normal file upload input, custom file upload input and dropzone and the reset resets the input properly.
Can you explain a little more detailed what do you see on the page after the reset?

#9
#10
#11