AG Grid Date Filter/Picker not working

Hi!

I have date that is extracted via Python from SQL and converted to datetime64[ns] format via following line.

df["date"] = pd.to_datetime(df["date"])

image

Data is perfectly displayed in the Dash AG Grid:
image

The problem is that Date Filter/Picker is not working and I cannot understand why.
When I pick a date in filter all data is disappearing like it cannot find any results for that date.

Here is the code that I am using:

date_obj = "d3.utcParse('%Y-%m-%dT%H:%M:%S')(params.data.date)"

columnDefs = [
    {
        "headerName": "Date",
        "field": "date",
        "filter": "agDateColumnFilter",
        "valueGetter": {"function": date_obj},
        "valueFormatter": {"function": f"d3.timeFormat('%d-%m-%Y')({date_obj})"},
        "filterParams": {
            "browserDatePicker": True,
            "minValidYear": 2020,
            "maxValidYear": 2030,
            'buttons': ['reset', 'apply']
        }
]

Any suggestions?

Hi @mrel

It’s important to know the filter works with dates only and and not datetime. Personally, I think it’s easiest to convert the datetime to a date string in the format yyyy-mm-dd then handle the date like in this example:

However, if that’s not possible, you can write your own custom date comparator to handle the datetime like in this example:

dag-docs

2 Likes

Thank you, @AnnMarieW .
Your reply gave an idea of how to solve the issue.

1 Like