react-bootstrap: ToggleButtonGroup onChange does not work in version 0.31.1
This is the same issue as #2727… I’m not sure why that was closed so quickly.
On Chrome Version 59.0.3071.115, the onChange handler of a ToggleButtonGroup just isn’t being called.
Here’s my example:
import React, {Component} from 'react';
import ToggleButtonGroup from 'react-bootstrap/lib/ToggleButtonGroup';
import ToggleButton from 'react-bootstrap/lib/ToggleButton';
// import './AppointmentModal.css';
class AppointmentModalDemo extends Component {
constructor(props) {
super(props);
this.isAppMade = this.isAppMade.bind(this);
}
isAppMade(vals) {
console.log(vals);
}
render() {
return (
<div className="appointment-modal">
<ToggleButtonGroup
type="radio"
name="appointmentMade"
onChange={this.isAppMade}>
<ToggleButton value={1}>Yes</ToggleButton>
<ToggleButton value={2}>No</ToggleButton>
</ToggleButtonGroup>
</div>
);
}
}
export default AppointmentModalDemo;
I would expect something to be dumped on the console each time I press a button, but I’m getting nothing.
About this issue
- Original URL
- State: closed
- Created 7 years ago
- Comments: 29 (6 by maintainers)
Found the issue, the problem occurs when bootstrap js file included.
https://codepen.io/kamote/pen/gGvadB
Still have the issue with React 15.5.4. Anyone else?
I am not including
bootstrap-loaderin my webpack, and this bug is still there.Same problem here with
0.31.2had to use a workaround.Didn’t debug it, however on webpackbin with same versions of the packages, onChange does work. Inside our app, however, it doesn’t.
I used a workaround by passing an onClick handler to the individual ToggleButton’s instead.
So what is the work around? Can I disable the js file just for my react components?
Echoing @corellian comment - we’re not including
bootstrap-loadereither and are still experiencing this issue.