diff --git a/app/assets/javascripts/fileUpload.js b/app/assets/javascripts/fileUpload.js index 4df2a1702..1ccc724e2 100644 --- a/app/assets/javascripts/fileUpload.js +++ b/app/assets/javascripts/fileUpload.js @@ -3,20 +3,16 @@ Modules.FileUpload = function() { - let $field; + let $form; - this.submit = function() { - - $field.parents('form').trigger('submit'); - - }; + this.submit = () => $form.trigger('submit'); this.start = function(component) { - $field = $('.file-upload-field', component); + $form = $(component); // Need to put the event on the container, not the input for it to work properly - $(component).on('change', '.file-upload-field', this.submit); + $form.on('change', '.file-upload-field', this.submit); }; diff --git a/app/assets/javascripts/main.js b/app/assets/javascripts/main.js index f19cc9f9c..23cde7b51 100644 --- a/app/assets/javascripts/main.js +++ b/app/assets/javascripts/main.js @@ -1,3 +1,5 @@ $(() => GOVUK.modules.start()); $(() => new GOVUK.SelectionButtons('.block-label input, .sms-message-option input')); + +$(() => $('.error-message').eq(0).parent('label').next('input').trigger('focus')); diff --git a/app/assets/stylesheets/components/file-upload.scss b/app/assets/stylesheets/components/file-upload.scss index d674944a5..96a6b6a3e 100644 --- a/app/assets/stylesheets/components/file-upload.scss +++ b/app/assets/stylesheets/components/file-upload.scss @@ -3,9 +3,15 @@ .file-upload { &-label { + @include bold-19; display: block; margin: 0 0 10px 0; + + .error-message { + padding: 0; + } + } &-field { @@ -33,6 +39,10 @@ padding-left: $gutter-half; } + &-submit { + display: none; + } + } } diff --git a/app/templates/components/file-upload.html b/app/templates/components/file-upload.html index 437ce699f..0d9e65fb9 100644 --- a/app/templates/components/file-upload.html +++ b/app/templates/components/file-upload.html @@ -1,5 +1,5 @@ {% macro file_upload(field, button_text="Choose file") %} -
+
-
+ + + {% endmacro %} diff --git a/app/templates/views/check-sms.html b/app/templates/views/check-sms.html index c41c4759f..4b1354847 100644 --- a/app/templates/views/check-sms.html +++ b/app/templates/views/check-sms.html @@ -45,12 +45,7 @@ Back {% else %} -
- {{file_upload(form.file, button_text='Choose a CSV file')}} - {{ page_footer( - "Upload" - ) }} -
+ {{file_upload(form.file, button_text='Upload a CSV file')}} {% endif %} {% call(item) list_table( diff --git a/app/templates/views/send-sms.html b/app/templates/views/send-sms.html index 32be81c72..7e44bad16 100644 --- a/app/templates/views/send-sms.html +++ b/app/templates/views/send-sms.html @@ -12,19 +12,16 @@

Add recipients

-
- -
-
- {{ sms_message(template.formatted_as_markup) }} -
+
+
+ {{ sms_message(template.formatted_as_markup) }}
+
-

- Download an example CSV file -

+

+ Download an example CSV file +

- {{file_upload(form.file, button_text='Upload a CSV file')}} + {{file_upload(form.file, button_text='Upload a CSV file')}} - {% endblock %} diff --git a/tests/app/main/views/test_sms.py b/tests/app/main/views/test_sms.py index 573e41d14..0c50631dc 100644 --- a/tests/app/main/views/test_sms.py +++ b/tests/app/main/views/test_sms.py @@ -66,7 +66,7 @@ def test_upload_csvfile_with_invalid_phone_shows_check_page_with_errors(app_, assert 'Your CSV file contained missing or invalid data' in content assert '+44 123' in content assert '+44 456' in content - assert 'Choose a CSV file' in content + assert 'Upload a CSV file' in content @moto.mock_s3