I'm working with checkbox input. When I click on checbox, checkbox don't show checked but checkbox's value I still get. I use React JS
Simple checkbox
import React from 'react';
import callApi from './../../utils/apiCaller'
import { Link } from 'react-router-dom'
class ProductActionPage extends React.Component {
constructor(props) {
super(props);
this.state = {
id: '',
productStatus: ''
}
}
onChange = (e) => {
var target = e.target;
var name = target.name;
var value = target.type === 'checkbox' ? target.checked : target.value;
this.setState({
[name]: value
});
}
render() {
var statusCheckbox = this.state.productStatus === 'true' ? true : false;
return (
<div className="row">
<div className="col-xs-6 col-sm-6 col-md-6 col-lg-6">
<div className="form-group">
<label>Trang thai: </label>
</div>
<div className="checkbox">
<label>
<input type="checkbox" checked={statusCheckbox} name="productStatus" onChange={this.onChange} />
Con hang
</label>
</div>
<button type="submit" className="btn btn-primary">Luu lai</button>
<Link to="/product/list" className="btn btn-danger ml-5">Huy bo</Link>
</div>
</div>
);
}
}
How can I show checked checkbox?
Aucun commentaire:
Enregistrer un commentaire