diff --git a/common/static/js/spec_helpers/edx.utils.validate.js b/common/static/js/spec_helpers/edx.utils.validate.js
index cf41b58568..b17ed04b24 100644
--- a/common/static/js/spec_helpers/edx.utils.validate.js
+++ b/common/static/js/spec_helpers/edx.utils.validate.js
@@ -13,9 +13,9 @@ var edx = edx || {};
email: '
A properly formatted e-mail is required',
min: '<%= field %> must be a minimum of <%= count %> characters long',
max: '<%= field %> must be a maximum of <%= count %> characters long',
- password: 'A valid password is required',
required: '<%= field %> field is required',
- terms: 'To enroll you must agree to the Terms of Service and Honor Code'
+ terms: 'To enroll you must agree to the Terms of Service and Honor Code',
+ custom: '<%= content %>'
},
field: function( el ) {
@@ -28,6 +28,7 @@ var edx = edx || {};
isBlank = _fn.validate.isBlank( $el );
if ( _fn.validate.isRequired( $el ) ) {
+console.log('is required');
if ( isBlank ) {
required = false;
} else {
@@ -40,7 +41,7 @@ var edx = edx || {};
}
response.isValid = required && min && max && email;
-
+console.log(response.isValid);
if ( !response.isValid ) {
response.message = _fn.validate.getMessage( $el, {
required: required,
@@ -78,7 +79,7 @@ var edx = edx || {};
},
isBlank: function( $el ) {
- return ( $el.attr('type') === 'checkbox' ) ? $el.prop('checked') : !$el.val();
+ return ( $el.attr('type') === 'checkbox' ) ? !$el.prop('checked') : !$el.val();
},
email: {
@@ -105,22 +106,33 @@ var edx = edx || {};
var txt = [],
tpl,
name,
- obj;
+ obj,
+ customMsg;
_.each( tests, function( value, key ) {
if ( !value ) {
name = $el.attr('name');
+ customMsg = $el.data('errormsg-' + key) || false;
- tpl = _fn.validate.msg[key];
+ // If the field has a custom error msg attached use it
+ if ( customMsg ) {
+ tpl = _fn.validate.msg.custom;
- obj = {
- field: _fn.validate.str.capitalizeFirstLetter( name )
- };
+ obj = {
+ content: customMsg
+ };
+ } else {
+ tpl = _fn.validate.msg[key];
- if ( key === 'min' ) {
- obj.count = $el.attr('minlength');
- } else if ( key === 'max' ) {
- obj.count = $el.attr('maxlength');
+ obj = {
+ field: _fn.validate.str.capitalizeFirstLetter( name )
+ };
+
+ if ( key === 'min' ) {
+ obj.count = $el.attr('minlength');
+ } else if ( key === 'max' ) {
+ obj.count = $el.attr('maxlength');
+ }
}
txt.push( _.template( tpl, obj ) );
diff --git a/lms/static/sass/views/_login-register.scss b/lms/static/sass/views/_login-register.scss
index cda41059fa..0abce46cca 100644
--- a/lms/static/sass/views/_login-register.scss
+++ b/lms/static/sass/views/_login-register.scss
@@ -119,6 +119,8 @@
}
.form-field {
+ @include clearfix;
+ clear: both;
width: 100%;
margin: 0 0 $baseline 0;
@@ -277,6 +279,12 @@
@include media( $tablet ) {
$grid-columns: 8;
+ %inline-form-field-tablet {
+ clear: none;
+ display: inline-block;
+ float: left;
+ }
+
.headline,
.tagline,
.form-type {
@@ -287,11 +295,30 @@
.form-toggle {
margin-right: 5px;
}
+
+ .form-field {
+ &.select-gender {
+ @extend %inline-form-field-tablet;
+ width: calc( 50% - 10px );
+ margin-right: 20px;
+ }
+
+ &.select-year_of_birth {
+ @extend %inline-form-field-tablet;
+ width: calc( 50% - 10px );
+ }
+ }
}
@include media( $desktop ) {
$grid-columns: 12;
+ %inline-form-field-desktop {
+ clear: none;
+ display: inline-block;
+ float: left;
+ }
+
.headline,
.tagline,
.form-type {
@@ -302,5 +329,24 @@
.form-toggle {
margin-right: 10px;
}
+
+ .form-field {
+ &.select-level_of_education {
+ @extend %inline-form-field-desktop;
+ width: 290px;
+ margin-right: 20px;
+ }
+
+ &.select-gender {
+ @extend %inline-form-field-desktop;
+ width: 60px;
+ margin-right: 20px;
+ }
+
+ &.select-year_of_birth {
+ @extend %inline-form-field-desktop;
+ width: 100px;
+ }
+ }
}
}
diff --git a/lms/templates/student_account/form_field.underscore b/lms/templates/student_account/form_field.underscore
index e6db67513d..b994e527b2 100644
--- a/lms/templates/student_account/form_field.underscore
+++ b/lms/templates/student_account/form_field.underscore
@@ -1,4 +1,4 @@
-
+
<% if ( type !== 'checkbox' ) { %>