No values in Dash AG Grid

Dash Python
1

I have a Dataframe (which shows values when printed in the terminal and also when convereted to a Dash Datatable).
However, when I try to use it to create a Dash AG Grid, only the first column is filled and the others have a header, but nothing else. This is the code for the grid:

import dash_ag_grid as dag

def .................(df_existing):

 column_defs = []
    for col_index, col_name in enumerate(df_existing.columns):
        column_defs.append(
            {
                "headerName": f"{col_name}",
                "field": f"{col_name}",
                "width": 500,
                "resizable": True,
                "filter": True,
            }
        )

    grid = dag.AgGrid(
        id="fomparision_table",
        className="ag-theme-alpine border",
        rowData=df_existing.to_dict("records"),
        columnDefs=column_defs,
        columnSize="sizeToFit",
        dashGridOptions={
            "domLayout": "autoHeight",
            "columnHoverHighlight": True,
            
        },
        style={"height": "100%", "fontSize": "20px"},
    )

    return grid

When I use the same code for other dataframes, it seems to work.
What could the problem here be?

2

Hello @subodhpokhrel7,

I recommend using flex: 1 in the columnDef instead of sizeToFit, see if that works better for you.

3

Hi @jinnyzor,

it doesn’t make a difference unfortunately.

The column name were filenames and ended with an extension. It works after the extension is removed.

4

Hi @subodhpokhrel7

With AG Grid it’s possible to have nested data (like dictionaries) in the rowData which are accessible with a dot notation. If you simply have a dot in the field name, than you can add this:

dag.AgGrid(

    dashGridOptions = {"suppressFieldDotNotation": True}
)

More info and examples here:

3 Likes
5

Thanks for posting that you figured it out.

However, please note that there was no way we could have known about what your data was.

This is why it is valuable to create a minimal working example with some sort of data that we can run to be able to troubleshoot with you.

2 Likes