diff --git a/lms/djangoapps/courseware/views.py b/lms/djangoapps/courseware/views.py index 040bdc420a..bc5aadce86 100644 --- a/lms/djangoapps/courseware/views.py +++ b/lms/djangoapps/courseware/views.py @@ -1541,6 +1541,7 @@ def financial_assistance_form(request): 'header_text': FINANCIAL_ASSISTANCE_HEADER, 'student_faq_url': marketing_link('FAQ'), 'dashboard_url': reverse('dashboard'), + 'account_settings_url': reverse('account_settings'), 'platform_name': settings.PLATFORM_NAME, 'user_details': { 'email': user.email, diff --git a/lms/static/js/financial-assistance/views/financial_assistance_form_view.js b/lms/static/js/financial-assistance/views/financial_assistance_form_view.js index 276d719b6e..dd1799ab98 100644 --- a/lms/static/js/financial-assistance/views/financial_assistance_form_view.js +++ b/lms/static/js/financial-assistance/views/financial_assistance_form_view.js @@ -12,7 +12,17 @@ 'text!templates/student_account/form_field.underscore', 'string_utils' ], - function(Backbone, $, _, gettext, FinancialAssistanceModel, FormView, formViewTpl, successTpl, formFieldTpl) { + function( + Backbone, + $, + _, + gettext, + FinancialAssistanceModel, + FormView, + formViewTpl, + successTpl, + formFieldTpl + ) { return FormView.extend({ el: '.financial-assistance-wrapper', events: { @@ -42,7 +52,8 @@ dashboard_url: context.dashboard_url, header_text: context.header_text, platform_name: context.platform_name, - student_faq_url: context.student_faq_url + student_faq_url: context.student_faq_url, + account_settings_url: context.account_settings_url }; // Make the value accessible to this View @@ -68,6 +79,7 @@ this.$el.html(_.template(this.tpl, data)); this.postRender(); + this.validateCountry(); return this; }, @@ -101,6 +113,31 @@ setExtraData: function(data) { return _.extend(data, this.user_details); + }, + + validateCountry: function() { + var $submissionContainer = $('.submission-error'), + $errorMessageContainer = $submissionContainer.find('.message-copy'), + $countryLabel = $('#user-country-title'), + txt = [ + 'Please go to your {link_start}profile page{link_end} ', + 'and provide your country of residence.' + ], + msg = window.interpolate_text( + // Translators: link_start and link_end denote the html to link back to the profile page. + gettext(txt.join('')), + { + link_start: '', + link_end: '' + } + ); + + if( !this.model.get('country') ){ + $countryLabel.addClass('error'); + $errorMessageContainer.append("
  • " + msg + "
    • "); + this.toggleDisableButton(true); + $submissionContainer.removeClass('hidden'); + } } }); } diff --git a/lms/static/js/spec/financial-assistance/financial_assistance_form_view_spec.js b/lms/static/js/spec/financial-assistance/financial_assistance_form_view_spec.js index bb83e29476..2aca04e9f6 100644 --- a/lms/static/js/spec/financial-assistance/financial_assistance_form_view_spec.js +++ b/lms/static/js/spec/financial-assistance/financial_assistance_form_view_spec.js @@ -98,7 +98,9 @@ define([ completeForm, validSubmission, successfulSubmission, - failedSubmission; + failedSubmission, + invalidCountry, + validCountry; completeForm = function() { var options = context.fields[0].options, @@ -131,6 +133,20 @@ define([ expect(view.$('.submission-error')).not.toHaveClass('hidden'); }; + invalidCountry = function() { + expect(view.$('.js-success-message').length).toEqual(0); + expect(view.$('.submission-error')).not.toHaveClass('hidden'); + expect(view.$('#user-country-title')).toHaveClass('error'); + expect(view.$('.js-submit-form').prop('disabled')).toBeTruthy(); + }; + + validCountry = function() { + expect(view.$('.js-success-message').length).toEqual(0); + expect(view.$('.submission-error')).toHaveClass('hidden'); + expect(view.$('#user-country-title')).not.toHaveClass('error'); + expect(view.$('.js-submit-form').prop('disabled')).toBeFalsy(); + }; + beforeEach(function() { setFixtures('
    '); @@ -189,6 +205,25 @@ define([ failedSubmission(); successfulSubmission(); }); + + it('renders with valid country', function(){ + validCountry(); + }); + + describe('when no country', function(){ + beforeEach(function() { + context.user_details.country = ''; + + view = new FinancialAssistanceFormView({ + el: '.financial-assistance-wrapper', + context: context + }); + }); + + it('renders invalid country', function() { + invalidCountry(); + }); + }); }); } ); diff --git a/lms/static/sass/views/_financial-assistance.scss b/lms/static/sass/views/_financial-assistance.scss index e8415e6da9..5d0e85dcc2 100644 --- a/lms/static/sass/views/_financial-assistance.scss +++ b/lms/static/sass/views/_financial-assistance.scss @@ -121,6 +121,10 @@ .title { @extend %fa-copy; padding: 0; + + &.error { + color: $red; + } } .data { diff --git a/lms/templates/financial-assistance/apply.html b/lms/templates/financial-assistance/apply.html index 7b8af4cdf6..03b7735275 100644 --- a/lms/templates/financial-assistance/apply.html +++ b/lms/templates/financial-assistance/apply.html @@ -14,6 +14,7 @@ FinancialAssistanceFactory({ header_text: ${escape_json_dumps(header_text)}, student_faq_url: ${json.dumps(student_faq_url)}, dashboard_url: ${json.dumps(dashboard_url)}, + account_settings_url: ${json.dumps(account_settings_url)}, platform_name: ${escape_json_dumps(platform_name)}, submit_url: ${json.dumps(submit_url)} }); diff --git a/lms/templates/financial-assistance/financial_assessment_form.underscore b/lms/templates/financial-assistance/financial_assessment_form.underscore index 7efe95c9c0..7d1b39dbe5 100644 --- a/lms/templates/financial-assistance/financial_assessment_form.underscore +++ b/lms/templates/financial-assistance/financial_assessment_form.underscore @@ -8,7 +8,7 @@
    @@ -31,7 +31,7 @@
    <%- name %>
    -
    <%- gettext('Country of residence') %>
    +
    <%- gettext('Country of residence') %>
    <%- country %>