score:0

simple you have to update the value and name in radio button.

check below code.

<label>
  <input
    type="radio"
    name="gender"
    value="male"
    checked={this.state.gender == "male"}
    onchange={this.handlechange}
  /> male<br />
</label>

<label>
  <input
    type="radio"
    name="gender"
    checked={this.state.gender == "female"}
    value="female"
    onchange={this.handlechange}
  /> female <br /> <br />
</label>

hope this will work for you!

score:1

you had some spelling mistakes, inconsistency with variables names and wrong logic at handlechange:

import react from 'react';

export default class app extends react.component {
  state = {
    firstname: '',
    lastname: '',
    age: '',
    gender: '',
    issubmitted: false
  };

  handlechange = event => {
    const { name, value } = event.target;
    console.log(event.target);
    this.setstate({ [name]: value });
  };

  handlesubmit = event => {
    this.setstate({ issubmitted: true });
    event.preventdefault();
  };

  render() {
    return (
      <main>
        <form onsubmit={this.handlesubmit}>
          <input
            type="text"
            name="firstname"
            value={this.state.firstname}
            placeholder="first name"
            onchange={this.handlechange}
          />
          <br />
          <input
            name="lastname"
            value={this.state.lastname}
            placeholder="last name"
            onchange={this.handlechange}
          />
          <br />
          <input
            type="number"
            name="age"
            value={this.state.age}
            placeholder="age"
            onchange={this.handlechange}
          />
          <br />
          <label>
            <input
              type="radio"
              name="gender"
              value="male"
              checked={this.state.gender === 'male'}
              onchange={this.handlechange}
            />{' '}
            male
            <br />
          </label>
          <label>
            <input
              type="radio"
              name="gender"
              checked={this.state.gender === 'female'}
              value="female"
              onchange={this.handlechange}
            />{' '}
            female <br /> <br />
          </label>
          <button>submit</button>
        </form>
        <hr />
        <h2>entered information:</h2>
        {this.state.issubmitted === true ? (
          <div>
            {' '}
            <p>
              {' '}
              your name: {this.state.firstname}
              {this.state.lastname}
            </p>
            <p> your age: {this.state.age} </p>
            <p> your gender: {this.state.gender} </p>{' '}
          </div>
        ) : (
          <div> </div>
        )}
      </main>
    );
  }
}

edit q-57834192-spelling


Related Query

More Query from same tag