Column widths incorrectly calculated based on previous rowData when using autoSize in AgGrid
Nobody has claimed this yet.
- Dominant language
- Python
- Stars
- 241
- Forks
- 47
- PR merge metrics
- No merged PRs in 30d
Description
Description
I'm using AgGrid component with columnSize="autoSize" configuration.
When the data filter value is changed, the grid column widths are calculated based on the previous instead on the latest rowData.
It seems like the DashAgGrid.updateColumnWidths() (and the inner gridApi.autoSizeAllColumns(skipHeader)) are called before the most recent rowData is set.
Expected behavior would be that the column widths are always aligned with the latest rowData.
How to Reproduce
Package version: dash-ag-grid==31.2.0
After running the code below, adjust the range slide filter as it's showed in the screen recoding (video below the code section):
import dash
from dash import dcc, html, Input, Output, callback
import dash_ag_grid as dag
import pandas as pd
# Initialize the Dash app
app = dash.Dash(__name__)
# Sample data
df = pd.DataFrame({
'Column 1': [1, 2, 3, 4, 5, 6],
'Column 2': ['A', 'B', 'C', 'VeryLongStringInputCell_VeryLongStringInputCell_VeryLongStringInputCell', 'D', 'E'],
'Column 3': [10.5, 20.1, 30.2, 40.3, 50.4, 60.5],
})
# Layout
app.layout = html.Div([
html.H1('Grid Page'),
html.Div(id="outer_div_grid_id"),
dcc.RangeSlider(id="filter_column_1_dropdown", min=1, max=6, step=1, value=[1, 6]),
])
@callback(
Output("outer_div_grid_id", "children"),
Input("filter_column_1_dropdown", "value"),
)
def update_outer_grid(dropdown_value):
df_filtered = df[df["Column 1"].between(dropdown_value[0], dropdown_value[1], inclusive="both")]
return [dag.AgGrid(
id='grid_id',
columnDefs=[{'field': col} for col in df.columns],
columnSize="autoSize",
rowData=df_filtered.to_dict('records'),
defaultColDef={'resizable': True},
)]
if __name__ == "__main__":
app.run_server(debug=True, port=8051)
https://github.com/user-attachments/assets/ffa449c4-4219-42ef-bf0e-a152449b0c58
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the provided Dash and AgGrid reproduction, then trace DashAgGrid.updateColumnWidths() and the inner gridApi.autoSizeAllColumns(skipHeader) call during a filter update. Done means column widths are calculated from the latest rowData rather than the previous filtered data, and the reproduction no longer shows stale sizing.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, python
- Domain
- frontend, web-dev
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 42/100