darkhelm/notifications-admin
1
0
Fork 0
mirror of https://github.com/GSA/notifications-admin.git synced 2026-02-05 10:53:28 -05:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #424 from alphagov/cancel-button

Browse Source 
Add cancel button to file upload pattern
This commit is contained in:
Chris Hill-Scott
2016-04-12 10:05:52 +01:00
parent faedb3d7be 82ecaa3628
commit 7388214118
2 changed files with 17 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
app/assets/javascripts/fileUpload.js
View File

@@ -3,19 +3,24 @@
Modules.FileUpload = function() {
let $form;
this.submit = () => this.$form.trigger('submit');
this.submit = () => $form.trigger('submit');
this.showCancelButton = () => $('.file-upload-button', this.$form).replaceWith(`
<a href="" class='file-upload-button-cancel'>Cancel upload</a>
`);
this.start = function(component) {
$form = $(component);
this.$form = $(component);
// Clear the form if the user navigates back to the page
$(window).on("pageshow", () => $form[0].reset());
$(window).on("pageshow", () => this.$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);
this.$form.on(
'change', '.file-upload-field',
() => this.submit() && this.showCancelButton()
);
};

7
app/assets/stylesheets/components/file-upload.scss
View File

@@ -31,6 +31,13 @@
&-button {
@include button($button-colour);
display: inline-block;
margin-right: 5px;
}
&-button-cancel {
@include button($error-colour);
display: inline-block;
margin-right: 5px;
}
&-filename {