Trying to call setAllFilters([]) and have an error #2253
Replies: 4 comments 1 reply
-
The column object doesnt have setAllFilter().. Sounds like you want setFilter() |
Beta Was this translation helpful? Give feedback.
-
Oh good. I tried to call it not only from a column. I ran into this problem when I was trying to set a filter on one column by several values. Perhaps you have some ideas? |
Beta Was this translation helpful? Give feedback.
-
Put three examples in codesandbox https://codesandbox.io/s/reverent-meadow-7fbrf |
Beta Was this translation helpful? Give feedback.
-
You need three things:
function MultiSelectColumnFilter({
column: { filterValue, setFilter, preFilteredRows, id },
}) {
// Calculate the options for filtering
// using the preFilteredRows
const options = React.useMemo(() => {
const options = new Set()
preFilteredRows.forEach(row => {
options.add(row.values[id])
})
return [...options.values()]
}, [id, preFilteredRows])
// Render a multi-select box
return (
<select
multiple // this prop for multiselect
value={filterValue}
// an appropriate multiselect handler (use Ctrl key to select multiple)
onChange={e => {
const allValues = Array.from(
e.target.selectedOptions,
).map(o => o.value).filter(Boolean)
setFilter(allValues && allValues .length ? allValues : undefined);
}}
>
<option value="">All</option>
{options.map((option, i) => (
<option key={i} value={option}>
{option}
</option>
))}
</select>
)
}
const filterTypes = React.useMemo(
() => ({
multiple: (rows, id, filterValue) => {
return rows.filter(row => {
const rowValue = row.values[id];
return rowValue !== undefined
? filterValue.includes(rowValue)
: true;
});
}
}),
[]
);
const columns = React.useMemo(
() => [
{
Header: "Info",
columns: [
{
Header: "Status",
accessor: "status",
Filter: MultiSelectColumnFilter,
filter: "multiple"
}
]
}
],
[]
); |
Beta Was this translation helpful? Give feedback.
Uh oh!
There was an error while loading. Please reload this page.
-
Trying to filter by multiple values and have an error. Also, I tried to pass an array to setFilter, but it doesn't work
I can't find a way to filter column by setting multiple values. For example, I have a column where I have rows with such values: 'on progress', 'hold', 'unrated', 'done' and I want to see only rows where I have values 'on progress' and 'done'. How can I do it?
https://codesandbox.io/s/reverent-meadow-7fbrf
Beta Was this translation helpful? Give feedback.
All reactions