Not getting password input field while other field is I am getting, On submitting form ReactJS/HTML form

Question

I have a form for user registration. I am entering data in input fields and when I am trying to submit the form I am getting the name input field value, but undefined for the password input field

This is my Re

const Register = () => {
  const registerAction = (e) => {
     e.preventDefault();
     console.log(e.target.email.value);
     console.log(e.target.password);
  };

  return (
    <div>
      <form onSubmit={registerAction}>
        <div className={classes.container}>
          <hr />

          <label for="email">
            <b>Email</b>
          </label>
          <input type="text" placeholder="Enter Email" name="email" required />
          <label for="psw">
            <b>Password</b>
          </label>
          <input
            type="password"
            placeholder="Enter Password"
            name="psw"
            required
          />
          <button className={classes.registerbtn}>Register</button>
        </div>
      </form>
    </div>
  );
};

export default Register;

This is my register form looks like, I know I am bad at styling

And my console output shows -

Here I don't know why am I getting password undefined? I want to store the email and password in my database to register the user.

Answer 1

you should use console.log(e.target.psw.value). You are using incorrect name of password input.

const registerAction = (e) => {
     e.preventDefault();
     console.log(e.target.email.value);
     console.log(e.target.psw.value);
  };