app/assets/javascripts/fileUpload.js

(function(Modules) {
  "use strict";

  Modules.FileUpload = function() {

    let $form;

    this.submit = () => $form.trigger('submit');

    this.start = function(component) {

      $form = $(component);

      // 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);
Add custom file upload component 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/ 2016-02-02 17:28:30 +00:00			`(function(Modules) {`
			`"use strict";`

			`Modules.FileUpload = function() {`

Fix missing CSRF token on send SMS page 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. 2016-02-22 21:37:32 +00:00			`let $form;`
Add custom file upload component 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/ 2016-02-02 17:28:30 +00:00
Fix missing CSRF token on send SMS page 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. 2016-02-22 21:37:32 +00:00			`this.submit = () => $form.trigger('submit');`
Add custom file upload component 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/ 2016-02-02 17:28:30 +00:00
			`this.start = function(component) {`

Fix missing CSRF token on send SMS page 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. 2016-02-22 21:37:32 +00:00			`$form = $(component);`
Add custom file upload component 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/ 2016-02-02 17:28:30 +00:00
			`// Need to put the event on the container, not the input for it to work properly`
Fix missing CSRF token on send SMS page 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. 2016-02-22 21:37:32 +00:00			`$form.on('change', '.file-upload-field', this.submit);`
Add custom file upload component 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/ 2016-02-02 17:28:30 +00:00
			`};`

			`};`

			`})(window.GOVUK.Modules);`