Create a Controlled Form - input should change state

What’s happening:

The code seems to work correctly, but it does not validate. The test fails at the following:

Typing in the input element should update the input property of the component’s state.

As far as I can see the input state is being changed.

My code so far:

class MyForm extends React.Component {
  constructor(props) {
    this.state = {
      input: '',
      submit: ''
    this.handleChange = this.handleChange.bind(this);
    this.handleSubmit = this.handleSubmit.bind(this);
  handleChange(event) {

  handleSubmit(event) {
      submit: this.state.input
  render() {
    return (

        <form onSubmit={this.handleSubmit}>
          <input type="text" onChange={this.handleChange} />
          <button type='submit'>Submit!</button>


Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3538.35 Safari/537.36.

Link to the challenge:

The input should be set up to always show this.state.input:

<input value={this.state.input} onChange={this.handleChange} />
1 Like

Thanks, I new I was missing something obvious!

1 Like