Manpreet Oberoi Manpreet Oberoi - 3 months ago 16
React JSX Question

retrieving value of checkbox in react.js

I am quite new to react.js and i want to retrieve value of my checkbox, when it is checked. ... can somebody guide me how to retrieve value of checkbox, when it is checked.

I am using this "http://react-component.github.io/checkbox/".
my code looks like this.

<div className="user_box">
{
check.map((values , i)=>{


return <Checkbox
name = "checkbox"
onChange={this.checkvalue.bind(this)}
value={values.username}
/>

})
}
</div>


my function

checkvalue(e){

//var all_users = [];
//var value = this.checkbox.value;
//all_users.push(value);
//console.log(all_users);

console.log('checkbox checked:', (e.target.checked));

}


still not getting how to retrieve value of it...

please guide me, if you guys some better idea also. thanks

Answer

you need to pass the "e, Synthetic event parameter to your handler" :

handleChange(e) {
  let isChecked = e.target.checked;
  // do whatever you want with isChecked value
}

render() {
  // ... your code here
  return (
    {/* your other jsx here */}
    <Checkbox otherProps onChange={e => this.handleChange(e)} />
    {/* your other jsx here */}
  );
}