Reset file upload field when user navigates back

**Problem**

The file upload form submit automatically whenever the name of the selected file
changes.

If the user picks a file, and then navigates back the field is pre-filled
because the page is loaded from the browser’s back/forward cache.

This means that if they pick the same file again, the value of the upload field
hasn’t changed, and the form won’t be submitted.

**Solution**

The solution is to clear the form field[1] if the page is being loaded from the
back/forward cache. Then any time the user picks a file it represents and
actual change.

1. http://stackoverflow.com/questions/8861181/clear-all-fields-in-a-form-upon-going-back-with-browser-back-button
This commit is contained in:
Chris Hill-Scott
2016-03-02 21:36:41 +00:00
parent 332d018d7c
commit f743759751

View File

@@ -11,6 +11,9 @@
$form = $(component);
// Clear the form if the user navigates back to the page
$(window).on("pageshow", () => $form[0].reset());
// Need to put the event on the container, not the input for it to work properly
$form.on('change', '.file-upload-field', this.submit);