1
0
Fork 0
mirror of https://git.rwth-aachen.de/acs/public/villas/web/ synced 2025-03-30 00:00:13 +01:00

add/edit user simple validation

This commit is contained in:
Ricardo Hernandez-Montoya 2017-05-03 17:30:00 +02:00
parent 39c8a2518a
commit 1c20d0c87d
2 changed files with 22 additions and 13 deletions

View file

@ -90,10 +90,9 @@ class EditUserDialog extends Component {
<FormControl type="text" placeholder="Enter username" value={this.state.username} onChange={(e) => this.handleChange(e)} />
<FormControl.Feedback />
</FormGroup>
<FormGroup controlId="mail" validationState={this.validateForm('mail')}>
<FormGroup controlId="mail">
<ControlLabel>E-mail</ControlLabel>
<FormControl type="text" placeholder="Enter e-mail" value={this.state.mail} onChange={(e) => this.handleChange(e)} />
<FormControl.Feedback />
</FormGroup>
<FormGroup controlId="role" validationState={this.validateForm('role')}>
<ControlLabel>Role</ControlLabel>

View file

@ -20,7 +20,7 @@
******************************************************************************/
import React, { Component, PropTypes } from 'react';
import { FormGroup, FormControl, ControlLabel } from 'react-bootstrap';
import { FormGroup, FormControl, ControlLabel, HelpBlock } from 'react-bootstrap';
import Dialog from './dialog';
@ -39,7 +39,7 @@ class NewUserDialog extends Component {
username: '',
mail: '',
role: 'admin',
password: '1234'
password: ''
};
}
@ -60,22 +60,26 @@ class NewUserDialog extends Component {
username: '',
mail: '',
role: 'admin',
password: '1234'
password: ''
});
}
validateForm(target) {
// check all controls
var username = true;
let username = this.state.username !== '' && this.state.username.length >= 3;
let password = this.state.password !== '';
if (this.state.username === '') {
username = false;
}
this.valid = username;
this.valid = username && password;
// return state to control
if (target === 'username') return username ? "success" : "error";
switch(target) {
case 'username':
return username ? "success" : "error";
case 'password':
return password ? "success" : "error";
default:
return "success";
}
}
render() {
@ -86,12 +90,18 @@ class NewUserDialog extends Component {
<ControlLabel>Username</ControlLabel>
<FormControl type="text" placeholder="Enter username" value={this.state.name} onChange={(e) => this.handleChange(e)} />
<FormControl.Feedback />
<HelpBlock>Min 3 characters.</HelpBlock>
</FormGroup>
<FormGroup controlId="mail" validationState={this.validateForm('mail')}>
<FormGroup controlId="mail">
<ControlLabel>E-mail</ControlLabel>
<FormControl type="text" placeholder="Enter e-mail" value={this.state.mail} onChange={(e) => this.handleChange(e)} />
<FormControl.Feedback />
</FormGroup>
<FormGroup controlId="password" validationState={this.validateForm('password')}>
<ControlLabel>Password</ControlLabel>
<FormControl type="text" placeholder="Enter password" value={this.state.password} onChange={(e) => this.handleChange(e)} />
<FormControl.Feedback />
</FormGroup>
<FormGroup controlId="role" validationState={this.validateForm('role')}>
<ControlLabel>Role</ControlLabel>
<FormControl componentClass="select" placeholder="Select role" value={this.state.role} onChange={(e) => this.handleChange(e)}>