search

bvaughn / react-virtualized

React components for efficiently rendering large lists and tabular data
http://bvaughn.github.io/react-virtualized/
MIT License
26.15k stars 3.06k forks source link

virtualised select : How to make searchable on specific label #1502

Open krsandesh opened 4 years ago

krsandesh commented 4 years ago

Hi ,

Consider i have data for options like this

ObjectCodes : [{ Id: 1002 Code: "897" Description: "truck" CodeDescription: "897 - truck" }, { Id: 1089 Code: "807" Description: "bus" CodeDescription: "898 - bus" }, { Id: 8990 Code: "342" Description: "car" CodeDescription: "342- car" }]

and my virtualised select is like below in react

<VirtualizedSelect
required options={this.props.masterData.ObjectCodes} value={this.state.selectedObjectCode1} labelKey="CodeDescription" placeholder="Select Object Code 1" onChange={selectedObjectCode1 => this.setState({ selectedObjectCode1, hasErrorSelectedObjectCode1: false }) } searchable={true} simpleValue valueKey="Id" />

when we search for 897 then it displays all the 3 records as it will search for the entire array (whats available in options attribute), here i want to be able to give search only on lablekey (CodeDescription). How can we achieve this.

BR/Sandesh Kirani

krsandesh commented 4 years ago

Here is the codesandbox link : codesandbox.io/s/virtualised-select-dbl2l , here search for 89 then we see all 3 get filtered as 89 is matches with ID and Code. Here i am looking at a way that i need to enable search only on CodeDescription (i.e., what ever mentioned in labelkey attribute, search should happen only on that)