Skip to content

Conversation

@siriwatknp
Copy link
Member

@siriwatknp siriwatknp commented Dec 4, 2025

closes #19974

Root Cause

The buildApplyFilterFn function in packages/x-data-grid/src/colDef/gridDateOperators.ts truncates seconds from both the filter value and row value before comparison for dateTime columns.

For equality operators (is, not), this is correct - comparing 7:30:00 to 7:30:30 should match since users can't input seconds in the filter UI.

But for comparison operators (after, before, onOrAfter, onOrBefore), truncating the row value causes incorrect filtering:

  1. User filters: "is after 02:09 PM"
  2. Filter value: 02:09:00 (seconds truncated - correct)
  3. Row value: 02:09:56 → truncated to 02:09:00 (wrong!)
  4. Comparison: 02:09:00 > 02:09:00 = false → row incorrectly excluded
// Before fix - row seconds were always truncated
return (value: Date): boolean => {
  const dateCopy = new Date(value);
  if (showTime) {
    dateCopy.setSeconds(0, 0); // Bug: truncates 02:09:56 to 02:09:00
  }
  return compareFn(dateCopy.getTime(), time);
};

Solution

Pass keepRawComparison=true (renamed from keepHours for clarity) for comparison operators to skip row value normalization.
Updated comparison operators to pass keepRawComparison:

{
  value: 'after',
  getApplyFilterFn: (filterItem) => {
    return buildApplyFilterFn(filterItem, (v1, v2) => v1 > v2, showTime, showTime);
  },                                            // keepRawComparison=true for dateTime ↑
},
{
  value: 'onOrAfter',
  getApplyFilterFn: (filterItem) => {
    return buildApplyFilterFn(filterItem, (v1, v2) => v1 >= v2, showTime, showTime);
  },
},
{
  value: 'before',
  getApplyFilterFn: (filterItem) => {
    return buildApplyFilterFn(filterItem, (v1, v2) => v1 < v2, showTime, true);
  },                                                           // always true ↑
},
{
  value: 'onOrBefore',
  getApplyFilterFn: (filterItem) => {
    return buildApplyFilterFn(filterItem, (v1, v2) => v1 <= v2, showTime, showTime);
  },
},

@siriwatknp siriwatknp added type: bug It doesn't behave as expected. scope: data grid Changes related to the data grid. feature: Filtering Related to the data grid Filtering feature labels Dec 4, 2025
@mui-bot
Copy link

mui-bot commented Dec 4, 2025

Deploy preview: https://deploy-preview-20557--material-ui-x.netlify.app/

Bundle size report

Bundle Parsed size Gzip size
@mui/x-data-grid 🔺+6B(0.00%) 🔺+4B(0.00%)
@mui/x-data-grid-pro 🔺+6B(0.00%) 🔺+4B(0.00%)
@mui/x-data-grid-premium 🔺+6B(0.00%) 🔺+3B(0.00%)
@mui/x-charts 0B(0.00%) 0B(0.00%)
@mui/x-charts-pro 0B(0.00%) 0B(0.00%)
@mui/x-charts-premium 0B(0.00%) 0B(0.00%)
@mui/x-date-pickers 0B(0.00%) 0B(0.00%)
@mui/x-date-pickers-pro 0B(0.00%) 0B(0.00%)
@mui/x-tree-view 0B(0.00%) 0B(0.00%)
@mui/x-tree-view-pro 0B(0.00%) 0B(0.00%)

Details of bundle changes

Generated by 🚫 dangerJS against f313901

@siriwatknp siriwatknp requested a review from a team December 4, 2025 04:38
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

feature: Filtering Related to the data grid Filtering feature scope: data grid Changes related to the data grid. type: bug It doesn't behave as expected.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[data grid] column type "dateTime" and built in operator after is not filtering properly.

2 participants