mui
[data grid] Allow filter behavior to be customized
The problem in depth
We have a question about the DataGridPro component. Ref page: https://mui.com/x/react-data-grid/editing/
The first example DataGrid under the “Full-featured CRUD” section exhibits the behavior we’re trying to solve.
The behavior of the component is as follows: • Apply a filter on the grid • Hit the “Add Record” button • The record does not appear because it automatically gets filtered out.
We want the default behavior to be as follows: • Apply a filter on the grid • Hit the “Add Record” button • The record shows in the grid and allows you to enter whatever data you intend and does not disappear unless the filter is re-applied or a new filter is added.
This is similar to how filters work in Excel / other spreadsheet tools. The use case is that we often have large datasets where people need to add new rows, but first need to filter down to see a subset of the data first and be able to enter the new row adjacent to the filtered set of rows.
The filter method and the add record method are both abstracted by the component so it’s unclear to us as to how we can change this behavior but assume there is a way using the APIs.
Really appreciate the support in advance!
Your environment
`npx @mui/envinfo`
Don't forget to mention which browser you used.
Output from `npx @mui/envinfo` goes here.
Search keywords: GridPro, Filter, Add Record Order ID: 92049
That behavior is not possible, it would require a modification of the filter logic which isn't customizable at the moment. I can add this as a feature request.
I suggest a filter prop to customize the filter result, it would run after our filters and would allow the user to override the behavior like this:
<DataGrid
filterRow={(row, isFiltered) => row.isEditing ? false : isFiltered}
/>
There might be a small (possibly negligible) impact on performance by adding the if (filterRow) { ... } branch in our filtering logic.
Thoughts?
Similar issue for applying sort after edit #13728 I would propose that both filtering and sorting are addressed as part of this issue
I suggest a filter prop to customize the filter result, it would run after our filters and would allow the user to override the behavior like this:
A small point regarding the naming:
Probably it makes sense to use names coherent with the existing API method: isRowSelectable.
Something like isRowFilterable?
Hello
I'm facing the same problem here. Do we have any expectations to solve this issue in a short time?
