Auto select the first match in react auto complete

383 views Asked by At

I am using https://www.npmjs.com/package/react-autocomplete

where i have the same issue as raised in

https://github.com/reactjs/react-autocomplete/issues/239

and also after bit of reading i came to know there is a option to do so

https://github.com/reactjs/react-autocomplete/issues/266

please let know how to select the first item in the list by default, so that the user can hit enter and it will select the first in the list

My current implementation is as shown below

<Autocomplete
                    ref={el => this.input = el}
                    value={this.state.value}
                    inputProps={inputProps}
                    wrapperStyle={{ position: 'absolute', display: 'inline-block' }}
                    items={this.state.srnList}
                    getItemValue={item => item.name}
                    shouldItemRender={matchSRN}
                    onChange={(event, value) =>
                        this.setState({ value })
                    }
                    onSelect={(value) => this.onSelectSRN({ value })}
                    renderItem={(item, isHighlighted) =>
                        <div className= "menu" style={{ background: isHighlighted ? '#e1e1e1' : 'white' }} key={item.name}>
                            {item.name}
                        </div>
                    }
                />
0

There are 0 answers