Skip to content

Instantly share code, notes, and snippets.

@dhavalv
Created December 16, 2016 13:08
Show Gist options
  • Save dhavalv/99dcbd51755cd739047ccaec6db756a8 to your computer and use it in GitHub Desktop.
Save dhavalv/99dcbd51755cd739047ccaec6db756a8 to your computer and use it in GitHub Desktop.
jsx
import React from 'react';
import { FormControl, FormGroup, Radio, Checkbox, Button, ControlLabel,HelpBlock } from 'react-bootstrap';

class Login extends React.Component {
    constructor(props){
        super(props);
        this.state = {
            username: '',
            password: '',
            errors:{}
        };

        //this.handleChange = this.handleChange.bind(this);
        this.handleSubmit = this.handleSubmit.bind(this);
    }

    /*getValidationState() {
        if(this.state.username == ''){
            return 'error';
        }else{
            return 'success';
        }
        if(this.state.password == ''){
            return 'error';
        }else{
            return 'success';
        }
    }
    handleChange(event) {
        if(!!this.state.errors[event.target.name]){
            let errors = Object.assign({},this.state.errors);
            delete errors[event.target.name];
            this.setState({
                [event.target.name]: event.target.value,
                errors
            });
        }else{
            this.setState({
                [event.target.name]: event.target.value
            });
        }

    }*/
    handleSubmit(event) {
        event.preventDefault();
        var donation = {
            username: this.state.username
        }
        $.ajax({
            url: '/api/auth/login/',
            dataType: 'json',
            type: 'POST',
            data: donation,
            success: function(data) {
                this.setState({data: data});
            }.bind(this),
            error: function(xhr, status, err) {
                console.error(this.props.url, status, err.toString());
            }.bind(this)
        });


    }

    render(){
        $('body').addClass('login-body');
        return (
            <div className="container">
                <form className="form-signin" onSubmit={this.handleSubmit}>
                    <h2 className="form-signin-heading">sign in now</h2>
                    <div className="login-wrap">
                        <FormGroup
                            controlId="forUsername"
                        >
                            <FormControl
                                name="username"
                                type="text"
                                value={this.state.value}
                                placeholder="User ID"
                            />
                            <FormControl.Feedback />
                        </FormGroup>
                        <FormGroup
                            controlId="forPassword"
                        >
                            <FormControl
                                name="password"
                                type="text"
                                value={this.state.value}
                                placeholder="Password"
                            />
                            <FormControl.Feedback />
                        </FormGroup>
                        <button className="btn btn-lg btn-login btn-block" type="submit">Sign in</button>
                    </div>
                </form>
            </div>
        )
    }
}

export default Login;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment