AgGrid rowData doesn't return all data

Dash Python
1

I have a fairly wide AgGrid table (36 columns)

For some aggregate columns I’m using valueGetter and valueSetter as I need to pass all rowData later in my app.

For some reason, the columns that are using Getter/Setter don’t get returned in rowData until I have scrolled to the actual column. Im not using virtualRowData.

Here is some code and my problem column in question. Im not sure where my issue is.

{
        "headerName": "2025 - Total",
        "children": [
            {
                "headerName": y,
                "valueGetter": {"function": f"params.getValue('g_{y}') + params.getValue('input_{y}');"},
                "valueSetter": {"function": f"valueSetterFinal(params, '{y}')"},
                "valueFormatter": {"function": "d3.format(',.1f')(params.value)"},
                "editable": False,
                "cellDataType": "number",
                "width": 70,

            }
            for x, y in {
                "f_A": "A1",
                "f_B": "B2",
                "f_C": "C3",
                "f_D": "D4",
                "f_E": "E5",
            }.items()
        ],
    }


// JS Function
dagfuncs.valueSetterFinal = (params, region) => {
    const newVal = params.newValue;
    const valueChanged = params.data[`f_${region}`] !== newVal;

    if (valueChanged) {
        params.data[`f_${region}`] = newVal;
    }
    return valueChanged;
};

Then I use a callback to get rowData

@app.callback(
    Output("sl-total", "rowData"),
    Input("sl-cg", "cellValueChanged"),
    Input("sl-parts", "cellValueChanged"),
    State("sl-cg", "rowData"),
    State("sl-parts", "rowData"),
    # prevent_initial_call=True,
)

def update_total(cg_event, parts_event, sl_cg, sl_parts):
    # Convert rowData to DataFrame
    df_cg = pd.DataFrame(sl_cg)
    df_parts = pd.DataFrame(sl_parts)

    # Add the two DataFrames, treating NaNs as 0 during addition.
    # Sets index so it doesnt concat the Account column.
    df_total = (
        df_cg.set_index("Accounts")
        .add(df_parts.set_index("Accounts"), fill_value=0)
        .reset_index()
    )

    # Convert DataFrame back to dictionary
    return df_total.to_dict("records")
2

Hello @Zak,

rowData is only the data that is provided to the grid, this will never include data from valueGetters and the like.

To have the data go back, the valueGetter needs to send the data back to the params.data and column. However, you need to keep in mind, rowData is normally not a good thing to use as an input.

3

@jinnyzor I did have a function to set params.data before I tried Getter/Setter but I was having the same issue.

dagfuncs.valueGetterTotal = (params, region) => {
    const newVal = params.data[`h_${region}`] + params.data[`adj_${region}`];

  
    params.data[`total_${region}`] = newVal;
  
    return newVal;
};

What is the preferred way to get rowData then? Currently I use cellValueChanged as an input then rowData as state.

My use case needs the ability to take two grids, and sum then to make a third grid with the ability to update the sum whenever grid1 or grid2 is changed by the user.

4

I believe in this case, that the rowData would be trailing the changes. As in, the rowData should have the update for the previously updated cell, after the other one. Is this what you are seeing?

However, you could use a cellValueChanged to update the target grid via a rowTransaction.

Another thing you could possibly do, is enable a setTimeout inside of a clientside callback that will trigger a button to sync the grids, which will work in a similar fashion to how your trigger is working currently.

5

Thank you! I will try that!

6

@jinnyzor sorry, didn’t see this part of the question. I think thats what Im seeing. I have recorded my grid so you can see the interactions. The grid should have 36 columns. You can see when I edit a cell in tab 1, 31 columns are returned. Only 36 are returned after I scroll to the end.

In tab 2, I show that if I scroll over to the end first then edit a cell, 36 columns are returned. This would also be the case in tab 1 as they are similar structure

Imgur