57 lines
1.7 KiB
JavaScript
57 lines
1.7 KiB
JavaScript
import React from 'react';
|
|
import './App.css';
|
|
import './bootstrap.min.css';
|
|
|
|
class LoginForm extends React.Component {
|
|
constructor(props) {
|
|
super(props);
|
|
this.state = {user: '', password: ''};
|
|
}
|
|
|
|
handleUserChange = (event) => {
|
|
this.setState({user: event.target.value});
|
|
}
|
|
|
|
handlePasswordChange = (event) => {
|
|
this.setState({password: event.target.value})
|
|
}
|
|
|
|
handleSubmit = (event) => {
|
|
event.preventDefault();
|
|
const data = new FormData(event.target);
|
|
|
|
fetch(this.props.targetUrl + '/login', {
|
|
method: 'POST',
|
|
body: data,
|
|
})
|
|
}
|
|
|
|
render() {
|
|
return (
|
|
<form className="form-vertical" id="main-form" onSubmit={this.handleSubmit}>
|
|
<div className="control-group">
|
|
<label className="sr-only" for="username">Name</label>
|
|
<div className="controls">
|
|
<input type="text" id="user" name="user" className="input-xlarge" placeholder="Username" value={this.state.user} onChange={this.handleUserChange} />
|
|
</div>
|
|
</div>
|
|
|
|
<div className="control-group">
|
|
<label className="sr-only" for="password">Password</label>
|
|
<div className="controls">
|
|
<input type="password" id="password" name="password" className="input-xlarge" placeholder="Password" value={this.state.password} onChange={this.handlePasswordChange} />
|
|
</div>
|
|
</div>
|
|
|
|
<div className="control-group">
|
|
<div className="controls">
|
|
<input type="submit" value="Submit" />
|
|
</div>
|
|
</div>
|
|
</form>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default LoginForm;
|