Hi everybody!
I’ve been making a series of AG grids that respond to selections in other AG grids. As in, when a row is selected in the control grid, a corresponding row shows up in another grid. However, I’ve been having issues with the second part of that functionality. When I select more than 2 rows in the control grid, the newly selected rows do not show up in the second grid. The newly selected rows only show up if I uncheck one of the first two selected rows, and even then, only 2 rows show up, even if I had selected 5 rows in the control grid. Here is an isolated example of what I’m working with:
from flask import Flask
import sys
print(sys.version)
from dash import Dash, html, dcc, dash_table, Output, Input, State, callback_context
import pandas as pd
import dash_ag_grid as dag
import plotly.express as px
import dash_daq as daq
import plotly.graph_objects as go
import dash_bootstrap_components as dbc
import numpy as np
#from collections import OrderedDict
from data import get_control_column_defs, get_control_row_data, get_peaks_row_data, get_peaks_column_defs
@app.callback(
[Output('peaks-summary-grid', 'filterModel'),
Output('peaks-summary-grid', 'style')],
Input('my-grid', 'selectedRows'),
State('peaks-summary-grid', 'filterModel')
)
def update_filter_model_and_visibility(selected_rows, current_filter_model):
if not selected_rows:
return {}, {'display': 'none'}
conditions = []
for row in selected_rows:
conditions.append({
'filterType': 'number',
'type': 'equals',
'filter': row['internal-id']
})
new_filter_model = {
'internal-id': {
'filterType': 'number',
'operator': 'OR',
'conditions': conditions
}
}
return new_filter_model, {'display': 'block'}
app.layout = dbc.Container([
dag.AgGrid(
#CONTROL GRID
id="my-grid", # use this id for update callbacks
columnDefs=get_control_column_defs(),
rowData=get_control_row_data(),
defaultColDef={"filter": True},
dashGridOptions={
"rowSelection": "multiple",
'suppressRowClickSelection': True,
'suppressMovableColumns': True,
'overflow':'scroll',
#'alwaysShowVerticalScroll':True,
"domLayout": "autoHeight",
'height':'200px'
},
),
dag.AgGrid(
#SECONDARY GRID
columnDefs=get_peaks_column_defs(),
rowData=get_peaks_row_data(),
defaultColDef=get_peaks_default_col_defs(),
dashGridOptions={#"animateRows": False,
"domLayout": "autoHeight",
'overflow':'scroll',
'height' : '200px'
},
id="peaks-summary-grid",
filterModel={},
#getRowStyle = getRowStyle,
style={'display': 'none','overflow':'scroll'} # starts off hidden, appears when rows are checked
], #closes container
fluid=True,
style={'display':'flex'},
className='full-container')
if __name__ == '__main__':
app.run_server(debug=True)