diff --git a/src/js/components/membershipInfoForm.js b/src/js/components/membershipInfoForm.js index 8a74c8c..2b8965e 100644 --- a/src/js/components/membershipInfoForm.js +++ b/src/js/components/membershipInfoForm.js @@ -1,5 +1,6 @@ 'use strict'; +var _ = require('lodash'); var request = require('axios'); var React = require('react'); var classSet = require('classnames'); @@ -105,16 +106,16 @@ module.exports = React.createClass({ 'sending': this.state.sending }); - var inputClasses = classSet({ - 'input': true, - 'has-error': this.state.errors.length - }); + /* generate error messages */ var feedbackMessages = []; + var fieldsWithErrors = []; this.state.errors.forEach((err, i) => { var feedbackText; + fieldsWithErrors.push(err.field); + if(err.type == 'missing') { feedbackText = `${fieldNameTranslations[err.field].fi} on pakollinen.` } else if (err.type == 'invalid') { @@ -124,38 +125,34 @@ module.exports = React.createClass({ feedbackMessages.push((
{feedbackText}
)) }); + + /* generate input fields */ + var fieldNames = ['name', 'email', 'handle', 'residence']; + var inputFields = []; + + fieldNames.forEach((fieldName) => { + var inputClasses = classSet({ + 'input': true, + 'has-error': _.includes(fieldsWithErrors, fieldName) + }); + + inputFields.push(( + + )) + }) + return (
{feedbackMessages} - - - - + {inputFields}