Breaking News: Grepper is joining You.com. Read the official announcement!

reactjs radio button onchange

Add Answer

answered on May 23, 2020 Popularity 10/10 Helpfulness 4/10

answer reactjs radio button onchange

related Radio button in react

related how to use radio buttons in react class-based components

related react input radio button

reactjs radio button onchange

Comments(1)

class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = {};
  }

  handleChange = e => {
    const { name, value } = e.target;

    this.setState({
      [name]: value
    });
  };

  render() {
    return (
      <div className="radio-buttons">
        Windows
        <input
          id="windows"
          value="windows"
          name="platform"
          type="radio"
          onChange={this.handleChange}
        />
        Mac
        <input
          id="mac"
          value="mac"
          name="platform"
          type="radio"
          onChange={this.handleChange}
        />
        Linux
        <input
          id="linux"
          value="linux"
          name="platform"
          type="radio"
          onChange={this.handleChange}
        />
      </div>
    );
  }
}

Popularity 10/10 Helpfulness 4/10 Language javascript

Source: stackoverflow.com

Tags: javascript

Link to this answer
Share Copy Link

Contributed on May 23 2020

0 Answers Avg Quality 2/10

Closely Related Answers

Radio button in react

Comment

  const [gender,setgender]=useState()

 const handlegender=(e)=>{
    setgender(e.target.value)
  }
 

 
 <form>
        
        <div>
          <label>Gender</label>
          <input type="radio" name="gender" value="male" onChange={handlegender} />
          Male
          <input type="radio" name="gender" value="Female" onChange={handlegender}/>
          Female
        </div>
      </form>

Popularity 10/10 Helpfulness 5/10 Language javascript

Source: Grepper

Tags: javascript j

Link to this answer
Share Copy Link

Contributed on Mar 07 2022

Developer FS

0 Answers Avg Quality 2/10

how to use radio buttons in react class-based components

Comment

class App extends React.Component {
  
  setGender(event) {
    console.log(event.target.value);
  }
  
  render() {
    return ( 
      <div onChange={this.setGender.bind(this)}>
        <input type="radio" value="MALE" name="gender"/> Male
        <input type="radio" value="FEMALE" name="gender"/> Female
      </div>
     )
  }
}

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

Popularity 10/10 Helpfulness 3/10 Language javascript

Source: stackoverflow.com

Tags: components c

Link to this answer
Share Copy Link

Contributed on Nov 29 2021

talhadev

0 Answers Avg Quality 2/10

react input radio button

Comment

function App() {
  return (
    <div>
      <label className="radio">
  <input name="radio" type="radio" checked/>
  <span>Awesome</span>
</label>
<label className="radio">
  <input name="radio" type="radio" />
  <span>Cool</span>
</label>
    </div>
  );
}

export default App;

Popularity 10/10 Helpfulness 3/10 Language javascript

Source: Grepper

Tags: input inpu

Link to this answer
Share Copy Link

Contributed on Jul 22 2022

Javasper

0 Answers Avg Quality 2/10

reactjs radio button onchange

Contents

More Related Answers

reactjs radio button onchange

Closely Related Answers

Radio button in react

how to use radio buttons in react class-based components

react input radio button

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.