Why is my code failing

JavaScript
#1

I am working on the React Challenge at: freecodecamp.org/learn/front-end-libraries/react/create-a-controlled-input. This is my code:

class ControlledInput extends React.Component {

  constructor(props) {

    super(props);

    this.state = {

      input: ''

    };

    // Change code below this line

    // Change code above this line

  }

  // Change code below this line

handleChange() {

  this.setState({

    input: event.target.value

  })

}

  // Change code above this line

  render() {

    return (

      <div>

        { /* Change code below this line */}

        <input value = {this.state.input} onChange={this.handleChange.bind(this)} />

        { /* Change code above this line */}

        <h4>Controlled Input:</h4>

        <p>{this.state.input}</p>

      </div>

    );

  }

};

I fail the third and final test. Everything seems to be working with the code.

#2

I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

Pre-formatted-text
Pre-formatted-text1356×380 401 KB

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (’).

If you have a question about a specific challenge as it relates to your written code for that challenge, you can just click the Ask for Help button located on the challenge. It will create a new topic with all code you have written and include a link to the challenge also. You will still be able to ask any questions in the post before submitting it to the forum.

#3

The fact that there is nothing between “Change code below this line” and “Change code above this line” is a red flag.

#4

Originally, I had:

    this.handleChange = this.handleChange.bind(this);

I deleted this line and built it into the html input element as shown in the hints section. Either way, it still fails the third test even though the p element seems to be showing the updating state.

#5

Looking at the challenge, the next thing that jumps out at me is that the instructions say:

First, create a method called handleChange() that has a parameter called event .

But your handleChange() does not take a parameter.

#6

Thanks! You solved my problem! Appreciate the help.