ascribe/onion
1
0
Fork 0
mirror of https://github.com/ascribe/onion.git synced 2025-01-03 18:35:09 +01:00
Code Issues Releases Wiki Activity

Add naive & manual validation to Form

Browse Source
This commit is contained in:
Tim Daubenschütz 2015-11-10 13:40:34 +01:00
parent be7fa0c6eb
commit 62eb78ae76
1 changed files with 59 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

62
js/components/ascribe_forms/form.js
View File

@ -12,7 +12,7 @@ import GlobalNotificationActions from '../../actions/global_notification_actions
import requests from '../../utils/requests';
import { getLangText } from '../../utils/lang_utils';
import { mergeOptionsWithDuplicates } from '../../utils/general_utils';
import { mergeOptionsWithDuplicates, sanitize } from '../../utils/general_utils';
let Form = React.createClass({
@ -155,7 +155,7 @@ let Form = React.createClass({
});
},
handleError(err){
handleError(err) {
if (err.json) {
for (let input in err.json.errors){
if (this.refs && this.refs[input] && this.refs[input].state) {
@ -185,7 +185,7 @@ let Form = React.createClass({
this.setState({submitted: false});
},
clearErrors(){
clearErrors() {
for(let ref in this.refs){
if (this.refs[ref] && typeof this.refs[ref].clearErrors === 'function'){
this.refs[ref].clearErrors();
@ -269,6 +269,62 @@ let Form = React.createClass({
}
},
_validateRef(refToValidate) {
let error = [];
Object
.keys(refToValidate)
.forEach((constraintKey) => {
const contraintValue = refToValidate[constraintKey];
if(!contraintValue) {
switch(constraintKey) {
case 'min' || 'max':
error.push(getLangText('The field you defined is not in the valid range.'));
break;
case 'pattern':
error.push(getLangText('The value you defined is not matching the valid pattern'));
break;
case 'required':
error.push(getLangText('This field is required.'));
break;
}
}
});
return error.length ? error : false;
},
valid() {
this.clearErrors();
const validatedFormInputs = {};
Object
.keys(this.refs)
.forEach((refName) => {
let refToValidate = {};
const property = this.refs[refName];
const input = property.refs.input;
const value = input.getDOMNode().value;
const { max,
min,
pattern,
required,
type } = input.props;
refToValidate.required = required ? value !== '' : true;
refToValidate.pattern = pattern && typeof value === 'string' ? value.match(pattern) : true;
refToValidate.max = type === 'number' ? parseInt(value) <= max : true;
refToValidate.min = type === 'number' ? parseInt(value) >= min : true;
const validatedRef = this._validateRef(refToValidate);
validatedFormInputs[refName] = validatedRef;
});
const errorMessagesForFields = sanitize(validatedFormInputs, (val) => !val);
this.handleError({ json: { errors: errorMessagesForFields } });
return !Object.keys(errorMessagesForFields).length;
},
render() {
let className = 'ascribe-form';