plotly / dash-ag-grid

Dash AG Grid is a high-performance and highly customizable component that wraps AG Grid, designed for creating rich datagrids.
https://dash.plotly.com/dash-ag-grid
MIT License
175 stars 25 forks source link

AgGrid cellClicked not working twice in a row #17

Closed Thuener closed 1 year ago

Thuener commented 1 year ago

The event cellClicked will not be activated twice for the same cell in a row.

Here is and example:

import pandas as pd
from dash import html,Input, Output, Dash
import dash_bootstrap_components as dbc
import dash_ag_grid

#
app = Dash(__name__, external_stylesheets=[dbc.themes.BOOTSTRAP])

# sample dataframe
df = pd.DataFrame({"col1": [1, 2, 3], "col2": ["A", "B", "C"]})

# column definition
column_defs = [
    {
        "headerName": "col1",
        "field": "col1",
    },
    {
        "headerName": "col2",
        "field": "col2",
    },
]
# layout
app.layout = html.Div(
    [
        dash_ag_grid.AgGrid(
            id="my-grid",
            rowData=df.to_dict("records"),
            columnDefs=column_defs,
        ),
    ]
)

@app.callback(
    Output("my-grid", "rowData"),
    Input("my-grid", "cellClicked")
)
def remove_line(cell_clicked):
    if cell_clicked is not None:
        col_id = cell_clicked["colId"]
        row_index = cell_clicked["rowIndex"]
        print(f"You clicked the icon in row {row_index} and col {col_id}")
    return df.to_dict("records")

if __name__ == '__main__':
    app.run_server(debug=True)

When you clicked twice on the same cel you get only one activation of the callback function:

You clicked the icon in row 0 and col col2

Instead you should have:

You clicked the icon in row 0 and col col2
You clicked the icon in row 0 and col col2

The only way to have two activation on the same cell is if you click on another and then go back:

You clicked the icon in row 1 and col col2
You clicked the icon in row 2 and col col2
You clicked the icon in row 1 and col col2
AnnMarieW commented 1 year ago

@Thuener Thanks for reporting! PR in progress