[DataGrid] Fix filtering with boolean column type
#15252
Conversation
|
Deploy preview: https://deploy-preview-15252--material-ui-x.netlify.app/ |
| @@ -54,13 +54,14 @@ function GridFilterInputBoolean(props: GridFilterInputBooleanProps) { | |||
| (event: React.ChangeEvent<HTMLInputElement>) => { | |||
| const value = event.target.value; | |||
| setFilterValueState(value); | |||
| applyValue({ ...item, value: Boolean(value) }); | |||
|
|
|||
| applyValue({ ...item, value: value ? String(value).toLowerCase() === 'true' : value }); | |||
There was a problem hiding this comment.
@arminmeh do you think we should also support uppercase values ?
filterModel: {
items: [
{
field: 'isAdmin',
operator: 'is',
value: "TRUE",
},
],
},
that's why I have used .toLowerCase()
There was a problem hiding this comment.
Thanks for this. I have expanded this even further
Since the earlier change strives to have boolean values in the filter model, I have refactored things to be boolean first and used a helper to make sure filter still responds correctly if strings (even invalid ones) are passed via setFilterModel API.
I have also expanded tests to cover some of these cases.
Let me know if you see any problems with it.
@mui/xgrid
Can someone else review this, since now I have my code in here as well
There was a problem hiding this comment.
Thanks this looks cleaner and more organized.
arminmeh
added
component: data grid
packages/x-data-grid/src/components/panel/filterPanel/GridFilterInputBoolean.tsx
Outdated
Show resolved
Hide resolved
arminmeh
changed the title
boolean column type
Co-authored-by: Armin Mehinovic <armin@mui.com>
Closes #15225
Related to #14327
Before : https://mui.com/x/react-data-grid/filtering/
After : https://deploy-preview-15252--material-ui-x.netlify.app/x/react-data-grid/filtering/