mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-02-05 02:42:26 -05:00
**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
25 lines
519 B
JavaScript
25 lines
519 B
JavaScript
(function(Modules) {
|
|
"use strict";
|
|
|
|
Modules.FileUpload = function() {
|
|
|
|
let $form;
|
|
|
|
this.submit = () => $form.trigger('submit');
|
|
|
|
this.start = function(component) {
|
|
|
|
$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);
|
|
|
|
};
|
|
|
|
};
|
|
|
|
})(window.GOVUK.Modules);
|