Unable to apply "grandTotalRow" configuration in Dash Ag Grid Row Grouping?

Dash Python
1

Hello folks:

So I was testing out the Dash Ag Grid Enterprise features, particularly the Row Grouping functionality. I am trying to pass in the “grandTotalRow = bottom” configuration to my Dash Ag Grid table which is grouping a bunch of columns, however not sure why it is not taking effect.

This is what I am referring to from Ag Grid’s documentation: https://www.ag-grid.com/javascript-data-grid/grouping-footers/

Below is how I am trying to use it in Dash Ag Grid table:

dag.AgGrid(
                    enableEnterpriseModules=True,
                    # licenseKey=<your_license_key>,
                    id="test",
                    columnDefs=column_defs,
                    rowData=holdings_data,
                    # defaultColDef={"flex": 1, "resizable": True},
                    defaultColDef={"resizable": True},
                    columnSize="responsiveSizeToFit",
                    style={"height": height},
                    className="ag-theme-alpine compact",
                    dashGridOptions={
                        "enableCharts": True,
                        "enableRangeSelection": True,
                        "grandTotalRow": "bottom",
                        "groupTotalRow": "bottom",
                    },
                )

Any thoughts on why this couldn’t be working or am I using it wrong in the first place? Also, I am still testing the enterprise version, so not using the key yet, in case that makes a difference.

@AnnMarieW Would be awesome if you can chime in as well.

Side note, I added “groupDefaultExpanded = 1” option in the above Dash Ag Grid method and that seems to be taking effect just fine, but not “grandTotalRow” or “groupTotalRow”.

I am on v.2.4.0.

Thanks a lot everyone!

2

Hi @manish1022iiti

I didn’t try it on 2.4.0, but I recommend upgrading to the latest version, which is 31.2.0.

Note that whenever you refer to the AG Grid docs, it’s necessary to use the version that’s associated with your dash-ag-grid version, 2.4.0 uses 29.3.5. You can find links to archived docs here:

https://www.ag-grid.com/archive/

Here’s the correct page for the current dag release: React Grid: Row Grouping - Group Footers | AG Grid

The prop names have changed. Here are the correct prop names for 31.2

  • Expanding groups reveals subtotal footers as groupIncludeFooter = true.
  • A grand total footer is shown as the groupIncludeTotalFooter = true.

Here’s a compete working version from the docs.


import dash_ag_grid as dag
from dash import Dash, html, dcc
import pandas as pd
import os


app = Dash(__name__)


df = pd.read_csv(
    "https://raw.githubusercontent.com/plotly/datasets/master/ag-grid/olympic-winners.csv"
)

columnDefs = [
    {'field': "country", 'rowGroup': True, 'hide': True},
    {'field': "year", 'rowGroup': True, 'hide': True},
    {'field': "gold", 'aggFunc': "sum"},
    {'field': "silver", 'aggFunc': "sum"},
    {'field': "bronze", 'aggFunc': "sum"},
]


app.layout = html.Div(
    [       
        dag.AgGrid(
            columnDefs=columnDefs,
            rowData=df.to_dict("records"),
            dashGridOptions={
                 "animateRows": False,
                 "groupIncludeFooter": True,
                 "groupIncludeTotalFooter": True
            },
            defaultColDef={"flex": 1, "minWidth": 150},
            id="grouped-grid",          
            enableEnterpriseModules=True,

        ),
    ]
)


if __name__ == "__main__":
    app.run(debug=True)
3

Hello @AnnMarieW

Thanks for your response. And makes perfect sense, will take a note of checking the underlying ag grid’s version going forward. Also, will update to the latest version.

Also, how do I check the underlying Ag Grid’s version being used by a particular Dash Ag Grid version?

Thank you.

4

Hi @manish1022iiti

Glad that worked for you.

Starting with Dash AG Grid V31.0.0, you can find your grid version by using dag.grid_version. Even though we try to keep the versions sync’d there can be some differences.

import dash_ag_grid as dag 

print("dash-ag-grid version: ", dag.__version__)
print("AG Grid version: ", dag.grid_version)

Prior to V31.0.0, you would have to look in the CHANGELOG.md.

Here’s a cross reference used in the docs:

AG_GRID_DOCS_ARCHIVES = {
    '31.2.0': '31.2.0',
    '31.1.0': '31.1.0',
    '31.0.1': '31.0.2',
    '31.0.0': '31.0.2',
    '2.4.0': '29.3.5',
    '2.3.0': '29.3.5',
    '2.2.0': '29.3.5',
    '2.1.0': '29.3.5',
    '2.0.0': '29.3.3',
}
5

Thanks @AnnMarieW this is really helpful. And I noticed that the latest versions of Dash Ag Grid are identical version numbers to the Ag Grid releases, which is super!

Thanks a lot for all your help.

Also, posted another question here if you have any thoughts: How has your experience been using Dash Ag Grid on mobile?

:slight_smile: