Topic: Labels change in InputSwitch
How to change On/Off text on MD InputSwitch to Yes/No? And if it is not possible now, when can we expect this option?
Anna Morawska staff answered 6 years ago
Hi Codewave,
indeed, it is not possible right now, thank you for bringing our attention to it. I've already changed it in our package, it will be updated on Monday. For now, you can test it by updating your mdbreact using branch #next. Please add #next to your gitURI as show bellow and run "npm update mdbreact"
"mdbreact": "git+https://oauth2:YOUR_TOKEN_GOES_HERE@git.mdbootstrap.com/mdb/react/re-pro.git#next"
Form then it will be possible to add labelLeft and labelRight props and pass a String to it to define your custom labels. An example below:
import React, { Component, Fragment } from "react";
import { InputSwitch } from "mdbreact";
class App extends Component {
state = {
switch1: true,
switch2: false
}
handleSwitchChange= (nr) => {
let switchNumber =`switch${nr}`;
this.setState({
[switchNumber]: !this.state[switchNumber]
});
}
render() {
return (
<Fragment>
<InputSwitch labelLeft="No" labelRight="Yes" checked={this.state.switch1} onChange={this.handleSwitchChange} />
<InputSwitch checked={this.state.switch2} onChange={this.handleSwitchChange} />
</Fragment>
);
}
}
export default App;
If you have more sugesstion, please post them bellow.
Best,
Ania
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Pro
- Premium support: No
- Technology: MDB React
- MDB Version: 4.7.1
- Device: Desktop
- Browser: Chrome
- OS: Ubuntu
- Provided sample code: No
- Provided link: No