Column Definitions

Basic Columns

AgGrid allows you to define the columns of your grid, passed to the prop column_defs. Each dictionary represents a column.

Here we define a grid with 3 columns:

column_defs = [
    {"field": "direction"},
    {"field": "strength"},
    {"field": "frequency"},
]

To set default properties for all your columns, you can define default_col_def in your grid:

default_col_def = {"editable": True}

Any column can override the default properties defined above by setting their own value:

column_defs = [
    {"field": "direction"},
    {"field": "strength", "editable": False},
    {"field": "frequency"},
]
default_col_def = {"editable": True}

Here is an example using both column_defs and default_col_def:

Columns Groups

It is also possible to group columns by defining a children property in the column definition. This property should be a list of column definitions.

column_defs = [
    {"field": "direction"},
    {
        "header_name": "Wind",
        "children": [
            {"field": "strength"},
            {"field": "frequency"},
        ],
    },
]

Example

Column Types

It is also possible to define column types that can be reused across multiple columns. This is useful when you have multiple columns with the same properties.

column_types = {
    "price": {
        "editable": False,
        "value_formatter": "'$' + params.value",
    },
}

Example