Tweak RequestQuoteView form to better fit best practices

* Scroll to errors
* Set email input type to 'email'
This commit is contained in:
Scott Erickson 2016-02-01 15:51:29 -08:00
parent 5fffb2eefb
commit ab62982bac
3 changed files with 16 additions and 5 deletions

View file

@ -62,6 +62,11 @@ module.exports.setErrorToProperty = setErrorToProperty = (el, property, message,
return console.error "#{property} not found in", el, "so couldn't show message:", message
setErrorToField input, message, warning
module.exports.scrollToFirstError = ($el=$('body')) ->
$first = $el.find('.has-error, .alert-danger, .error-help-block, .has-warning, .alert-warning, .warning-help-block').first()
$('body').nanoScroller({scroll: 'top'}) # normalizes offset().top value
$('body').nanoScroller({scrollTop: $first.offset().top - 20})
module.exports.clearFormAlerts = (el) ->
$('.has-error', el).removeClass('has-error')

View file

@ -14,7 +14,7 @@ block content
.col-sm-4
.form-group
label.control-label(data-i18n="general.email")
input.form-control(name="email")
input.form-control(name="email" type="email")
.row
.col-sm-offset-2.col-sm-4

View file

@ -53,12 +53,18 @@ module.exports = class RequestQuoteView extends RootView
attrs.educationLevel.push(@$('#other-education-level-input').val())
forms.clearFormAlerts(form)
result = tv4.validateMultiple(attrs, formSchema)
error = true
if not result.valid
return forms.applyErrorsToForm(form, result.errors)
if not /^.+@.+\..+$/.test(attrs.email)
return forms.setErrorToProperty(form, 'email', 'Invalid email.')
if not _.size(attrs.educationLevel)
forms.applyErrorsToForm(form, result.errors)
else if not /^.+@.+\..+$/.test(attrs.email)
forms.setErrorToProperty(form, 'email', 'Invalid email.')
else if not _.size(attrs.educationLevel)
return forms.setErrorToProperty(form, 'educationLevel', 'Check at least one.')
else
error = false
if error
forms.scrollToFirstError()
return
@trialRequest = new TrialRequest({
type: 'course'
properties: attrs