Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Specify default value to FormControl of react-bootstrap

In [email protected] I've used Input attribute defaultValue to specify start value selected in combobox

<Input type='select'
             ref='templateSelect'
             defaultValue={this.state.templateId}
             onChange={this.handleTemplateChange}>
   {options}
</Input>

How this should be handled in [email protected] ( newest one ) where Input was deprecated and new component that should be used here FormControl doesn't provide such attribute?

Should value be used instead?

<FormControl type='select'
             ref='templateSelect'
             value={this.state.templateId}
             onChange={this.handleTemplateChange}>
   {options}
</FormControl>

Or maybe something like this:

value={this.state.templateId || 'default value'}
like image 482
zmii Avatar asked Dec 15 '16 23:12

zmii


1 Answers

I didn't test this, but from the React Bootstrap source code for FormControl it seems like using defaultValue prop should work:

<FormControl type="select"
  ref="templateSelect"
  defaultValue={this.state.templateId}
  onChange={this.handleTemplateChange}>
   {options}
</FormControl>

If multi select defaultValue must be array:

this.state = {
  templateId:['some value']
}
<FormControl 
  multiple
  type="select"
  ref="templateSelect"
  defaultValue={this.state.templateId}
  onChange={this.handleTemplateChange}>
   {options}
</FormControl>
like image 95
Yangshun Tay Avatar answered Sep 22 '22 16:09

Yangshun Tay