Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

filterPlaceholder parameter of filterParams has no effect on Date filter #333

Open
msz0ke opened this issue Oct 8, 2024 · 1 comment
Open
Labels
documentation written for humans

Comments

@msz0ke
Copy link

msz0ke commented Oct 8, 2024

According to the docs, the filterPlaceholder parameter of filterParams can be assigned to Date filters. I have tried to provide them as various string formats, but it has no effect on the placeholder text, even when the browserDatePicker property is set to False.

I suspect this is not an issue with dash-ag-grid but with ag-grid itself: https://github.com/ag-grid/ag-grid/issues?q=label%3AAG-3735+is%3Aclosed. As the issue has been in their backlog for quite some time, I think it would be necessary to remove this parameter from the docs. If there is a way to override the locale (since the date format is locale dependent for the Date selector), could you please provide an example?

Related MRE:

import dash_ag_grid as dag
from dash import Dash, html, dcc
import pandas as pd

app = Dash(__name__)


df = pd.read_csv(
    "https://raw.githubusercontent.com/plotly/datasets/master/ag-grid/olympic-winners.csv"
)

# basic columns definition with column defaults
columnDefs = [
    {"field": "athlete", "filter": False},
    {"field": "country", "filter": False},
    {
        "headerName": "Date",
        "filter": "agDateColumnFilter",
        "valueGetter": {"function": "d3.timeParse('%d/%m/%Y')(params.data.date)"},
        "valueFormatter": {"function": "params.data.date"},
        "filterParams": {
            "browserDatePicker": True,
            "filterPlaceholder": 'yyyy-mm-dd',
        },
    },
]

defaultColDef = {
    "flex": 1,
    "minWidth": 150,
    "filter": True,
    "floatingFilter": True,
}

app.layout = html.Div(
    [
        dcc.Markdown("Date Filter Example"),
        dag.AgGrid(columnDefs=columnDefs, rowData=df.to_dict("records"), defaultColDef=defaultColDef),
    ],
    style={"margin": 20},
)

if __name__ == "__main__":
    app.run_server(debug=True)
@gvwilson gvwilson added bug something broken P3 backlog labels Oct 8, 2024
@AnnMarieW
Copy link
Collaborator

Hi @msz0ke - You are correct that this looks like an issue in the upstream AG Grid library. The recommended workaround is to use a custom date picker component and you can find an example in the docs here https://dash.plotly.com/dash-ag-grid/cell-editor-components.

We can make a note of this issue in the docs, but I don't recommend removing it because the placeholder can be used in custom components and other data types.

Since there will be no changes to this library, this will be closed. This would be a great topic for the community forum to discuss other options for workarounds.

@AnnMarieW AnnMarieW added documentation written for humans and removed P3 backlog bug something broken labels Oct 8, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
documentation written for humans
Projects
None yet
Development

No branches or pull requests

4 participants