Hi there,
I'am trying to pre-select on option from my form state object but cannot manage to render it. As an example, doing this works if I use a string:
class SelectPage extends Component { render() { return ( <div> <MDBSelect> <MDBSelectInput selected="Choose your option" /> <MDBSelectOptions> <MDBSelectOption disabled>Choose your option</MDBSelectOption> <MDBSelectOption value="1">Option nr 1</MDBSelectOption> <MDBSelectOption value="2">Option nr 2</MDBSelectOption> <MDBSelectOption value="3" selected={_id === "456ef-78e78-feff56"}>Option nr 3</MDBSelectOption> </MDBSelectOptions> </MDBSelect> <label>Example label</label> </div> ); } }
But this doesn't when I use the state object:
class SelectPage extends Component { render() { return ( <div> <MDBSelect> <MDBSelectInput selected="Choose your option" /> <MDBSelectOptions> <MDBSelectOption disabled>Choose your option</MDBSelectOption> <MDBSelectOption value="1">Option nr 1</MDBSelectOption> <MDBSelectOption value="2">Option nr 2</MDBSelectOption> <MDBSelectOption value="3" selected={_id === this.props.myId}>Option nr 3</MDBSelectOption> <MDBSelectOption value="4">Option nr 4</MDBSelectOption> <MDBSelectOption value="5">Option nr 5</MDBSelectOption> </MDBSelectOptions> </MDBSelect> <label>Example label</label> </div> ); } }
Here this.props.myId come from my form state object and passed to the component via props. On Chrome's react.js developer tools the this.props.myId is populated correctly.
The only thing I really want to do is this below but I cannot manage to do it with the MDB react select component:
<select value={optionsState}> <option value="A">Apple</option> <option value="B">Banana</option> <option value="C">Cranberry</option> </select>
Thanks in advance for your help.
Bad0% question quality
The higher quality the better and faster answer you'll get.