Authorization form

Hello everyone!

I am currently doing the authorization form project on the Codecademy code editor and for some reason I cannot get past the last step. Every time I try to put in the password (which i changed to my name just to be sure), I can not get through to the contact info. I have looked over it multiple times and I have followed the video ( I even made some tweaks then), but I can not figure it out, would anyone have any advice?

import React from 'react';
import ReactDOM from 'react-dom';

class Contact extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      password: 'calvin',
      authorized: false
    };
    this.authorize = this.authorize.bind(this);
  }

  authorize(e) {
    const password = e.target.querySelector(
      'input[type="password"]').value;
    const auth = password == this.state.password;
    this.setState({
      authorize: auth
    });
  }

  render() {
    const login = (
      <form 
      action = "#"
      onSubmit = {this.authorized} >
      <input 
      type = "password"
      placeholder = "Password" />
      <input type = "submit" />
      </form>
    );

    const contactInfo = (
      <ul>
          <li>
            client@example.com
          </li>
          <li>
            555.555.5555
          </li>
        </ul>
    )

    return (
      <div id="authorization">
        <h1>{this.state.authorized ? 'Contact' : 'Enter the Password'}</h1>
        {this.state.authorized ? contactInfo : login}
      </div>
    );
  }
}

ReactDOM.render(
  <Contact />, 
  document.getElementById('app')
);

This topic was automatically closed 41 days after the last reply. New replies are no longer allowed.