JSFiddle - React, Tailwind, and code Playground
JavaScript
import React, { Component } from "react"
import { MDBCol, MDBContainer, MDBRow, MDBBtn, MDBSelect, MDBInput, MDBSelectInput, MDBSelectOption, MDBSelectOptions, MDBCardBody, MDBCard } from "mdbreact";
class RegisterPage extends Component {
constructor() {
super();
this.state = {
name: "",
email: "",
password: "",
password2: "",
country: "",
sex: "",
race: "",
ageRange: "",
political: "",
relationship: "",
income: "",
education: "",
career: "",
errors: {}
};
this.onChange = this.onChange.bind(this);
this.onSubmit = this.onSubmit.bind(this);
}
onChange = e => {
this.setState({ [e.target.id]: e.target.value });
// const { name, value } = e.target;
// this.setState({
// [name]: value
// });
};
onSubmit = e => {
alert(this.state.country)
e.preventDefault();
const newUser = {
name: this.state.name,
email: this.state.email,
password: this.state.password,
password2: this.state.password2,
country: this.state.country,
sex: this.state.sex,
race: this.state.race,
ageRange: this.state.ageRange,
political: this.state.political,
relationship: this.state.relationship,
income: this.state.income,
education: this.state.education,
career: this.state.career,
};
console.log(newUser);
};
render() {
const { errors } = this.state;
return (
<MDBContainer>
<MDBRow>
<MDBCol md="12">
<MDBCard>
<div className="header pt-3 morpheus-den-gradient">
<MDBRow className="d-flex...