mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-02-05 10:53:28 -05:00
The default browser file upload control is difficult to style, but looks totally out of place. This commit replaces it with one that has a GOV.UK style button, as a first step. Based heavily on this example: http://tympanus.net/codrops/2015/09/15/styling-customizing-file-inputs-smart-way/
28 lines
605 B
JavaScript
28 lines
605 B
JavaScript
(function(Modules) {
|
|
"use strict";
|
|
|
|
Modules.FileUpload = function() {
|
|
|
|
let $field, $button, $filename;
|
|
|
|
this.update = function() {
|
|
|
|
$filename.text($field.val().split('\\').pop());
|
|
|
|
};
|
|
|
|
this.start = function(component) {
|
|
|
|
$field = $('.file-upload-field', component);
|
|
$button = $('.file-upload-button', component);
|
|
$filename = $('.file-upload-filename', component);
|
|
|
|
// Need to put the event on the container, not the input for it to work properly
|
|
$(component).on('change', '.file-upload-field', this.update);
|
|
|
|
};
|
|
|
|
};
|
|
|
|
})(window.GOVUK.Modules);
|