We’ve seen users try to click the upload again when their file doesn’t
upload in time. This is because we’re giving them no feedback that
something is happening.
I reckon that changing the button to a cancel button is the easiest way
to show that something is happening, and also means that (unlike
disabling the send button) the user can’t get stuck if the connection
drops completely.
**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
As part of https://github.com/alphagov/notifications-admin/pull/187 the file
upload pattern was changed to auto-submit once a file had been picked. The
form that was submitted was, however, missing a CSRF token, as well as a submit
button for non-JS users.
This commit makes the file upload pattern self-contained, so that it will always
include a form with a CSRF token in a hidden input and a submit button, which is
then hidden when Javascript loads.
The ‘manage templates’ page was almost identical to the ‘send text messages’
page.
This commit consolidates them into one and makes them all hang together.
Part of this means tweaks to the javascript so that files upload as soon as
you’ve chosen them.
