Update selectedRows and rowData of AgGrid at once

Dash Python
1

I’d like to select rows in a grid, according to a selection made in a graph. At the same time I’d like to move the selected points on top. As far as I can see, there is now order-by-selection-method or anything like that.
When trying to do so: The ordering done but that resets the grid and the selectedData disappears:

import numpy as np
import plotly.graph_objects as go
from dash import Dash, html, dcc, callback
from dash.dependencies import Input, Output, State
import dash_ag_grid as dag

app = Dash(__name__)

np.random.seed(0)
x = np.random.rand(50)
y = np.random.rand(50)

app.layout = html.Div([
    dcc.Graph(
        id='graph',
        figure={
            'data': [go.Scatter(x=x, y=y, mode='markers')],
            'layout': go.Layout(
                xaxis=dict(title='X'),
                yaxis=dict(title='Y'),
                hovermode='closest'
            )
        }
    ),
    dag.AgGrid(
        id="grid",
        columnDefs=[
            {"field": "x", "sortable": True, "filter": True},
            {"field": "y", "sortable": True, "filter": True},
        ],
        rowData=[{"x": x_val, "y": y_val, "id": i} for i, (x_val, y_val) in enumerate(zip(x, y))]),
])


@callback(
    Output('grid', 'rowData'),
    Input('graph', 'selectedData'),
    State('grid', 'rowData'),
    prevent_initial_call=True,
)
def update_grid(selected_data, row_data):
    if selected_data:
        selected_points = selected_data['points']
        selected_ids = [point['pointIndex'] for point in selected_points]
        for row in row_data:
            if row['id'] in selected_ids:
                row['selected'] = True
            else:
                row['selected'] = False
        sorted_row_data = sorted(row_data, key=lambda row: not row['selected'])
        return sorted_row_data
    return row_data


@callback(
    Output('grid', 'selectedRows'),
    Input('graph', 'selectedData'),
    State('grid', 'rowData'),
    prevent_initial_call=True,
)
def update_selected_rows(selected_data, row_data):
    if selected_data:
        selected_points = selected_data['points']
        selected_ids = [point['pointIndex'] for point in selected_points]
        selected_rows = [str(row['id']) for row in row_data if row['id'] in selected_ids]
        return {"ids": selected_rows}
    return {"ids": []}


if __name__ == '__main__':
    app.run_server(debug=True, port=7000)
2

Hello @luggie,

This is a known issue and will be fixed with an updated release shortly.

@nathandrezner is so close to being done with his updates. :grin:

1 Like