I am trying to enable the filter option for multiselect, for the below array
incidentStatuses = ['NEW', 'ACKNOWLEDGED', 'ONHOLD', 'ESCALATED', 'RESOLVED'];
<MultiSelect value={options.value} options={this.incidentStatuses}
onChange={(e) => options.filterCallback(e.value, options.index)}
placeholder="Status" className="multiselect-custom" filter filterMatchMode={FilterOperator.CONTAINS}
/>;
This is showing the filter search in my multiselect dropdown, but when I search for the data present in the array, it's not showing anything.
Please assist on how can I achieve this ???
Multiselect filter not working for an array
for arrays and lists you want `filterMatchMode={FilterMatchMode.IN}`
Code: Select all
filterMatchMode={FilterMatchMode.IN}
PrimeFaces Developer | PrimeFaces Extensions Developer
GitHub Profile: https://github.com/melloware
PrimeFaces Elite 13.0.0 / PF Extensions 13.0.0
PrimeReact 9.6.1
GitHub Profile: https://github.com/melloware
PrimeFaces Elite 13.0.0 / PF Extensions 13.0.0
PrimeReact 9.6.1
I tired below IN match mode as well, but no luck
<MultiSelect value={options.value} options={this.incidentStatuses}
itemTemplate={this.statusItemTemplate}
onChange={(e) => options.filterCallback(e.value, options.index)}
filter filterMatchMode={FilterMatchMode.IN}
placeholder="Status" className="multiselect-custom"
/>
Looks like when I use in below way it works, but since I am using this in a datatable to filter column, the below object, does not filter my datatable, because the response I am getting from API is directly the status.
incidentStatuses = [name : 'NEW',name: 'ACKNOWLEDGED', name: 'ONHOLD', name: 'ESCALATED', name: 'RESOLVED'];
<MultiSelect value={options.value} options={this.incidentStatuses}
itemTemplate={this.statusItemTemplate}
onChange={(e) => options.filterCallback(e.value, options.index)}
filter filterMatchMode={FilterMatchMode.IN} optionLabel='name'
placeholder="Status" className="multiselect-custom"
/>
<MultiSelect value={options.value} options={this.incidentStatuses}
itemTemplate={this.statusItemTemplate}
onChange={(e) => options.filterCallback(e.value, options.index)}
filter filterMatchMode={FilterMatchMode.IN}
placeholder="Status" className="multiselect-custom"
/>
Looks like when I use in below way it works, but since I am using this in a datatable to filter column, the below object, does not filter my datatable, because the response I am getting from API is directly the status.
incidentStatuses = [name : 'NEW',name: 'ACKNOWLEDGED', name: 'ONHOLD', name: 'ESCALATED', name: 'RESOLVED'];
<MultiSelect value={options.value} options={this.incidentStatuses}
itemTemplate={this.statusItemTemplate}
onChange={(e) => options.filterCallback(e.value, options.index)}
filter filterMatchMode={FilterMatchMode.IN} optionLabel='name'
placeholder="Status" className="multiselect-custom"
/>
I think this was fixed in 8.7.0: https://github.com/primefaces/primereact/issues/3420
PrimeFaces Developer | PrimeFaces Extensions Developer
GitHub Profile: https://github.com/melloware
PrimeFaces Elite 13.0.0 / PF Extensions 13.0.0
PrimeReact 9.6.1
GitHub Profile: https://github.com/melloware
PrimeFaces Elite 13.0.0 / PF Extensions 13.0.0
PrimeReact 9.6.1
-
- Information
-
Who is online
Users browsing this forum: No registered users and 8 guests