How to use the getContextMenuItems?

Hi,

I’ve seen in the changelog of Dash-AG-Grid 2.4.0 that getContextMenuItems was enabled, though I couldn’t find any documentation on how to enable it. I’ve asked the chatbot and received the below response.

To use the new getContextMenuItems feature in Dash AG Grid, you can define a callback function that returns a list of menu items. Each menu item is represented by a dictionary with properties like name, action, and disabled. Here’s an example:

COPY

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

df = pd.read_csv("https://raw.githubusercontent.com/plotly/datasets/master/wind_dataset.csv")

app = Dash(__name__)

columnDefs = [
    {'field': 'direction'},
    {'field': 'strength'},
    {'field': 'frequency'},
]

def get_context_menu_items(params):
    return [
        {'name': 'Copy', 'action': 'copy'},
        {'name': 'Paste', 'action': 'paste'},
        {'name': 'Delete', 'action': 'delete'},
    ]

grid = dag.AgGrid(
    id="get-context-menu-items-example",
    rowData=df.to_dict("records"),
    columnDefs=columnDefs,
    getContextMenuItems=get_context_menu_items,
)

app.layout = html.Div([grid])

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

In this example, the getContextMenuItems callback function is defined to return a list of three menu items: “Copy”, “Paste”, and “Delete”. You can customize the menu items and their actions according to your requirements.

Though I’m getting the following error when trying to implement it:

TypeError: The dash_ag_grid.AgGrid component (version 2.4.0) with the ID “table-ghg-entities” received an unexpected keyword argument: getContextMenuItems
Allowed arguments: cellClicked, cellDoubleClicked, cellRendererData, cellValueChanged, className, columnDefs, columnSize, columnSizeOptions, columnState, csvExportParams, dangerously_allow_code, dashGridOptions, defaultColDef, deleteSelectedRows, deselectAll, detailCellRendererParams, enableEnterpriseModules, exportDataAsCsv, filterModel, getDetailRequest, getDetailResponse, getRowId, getRowStyle, getRowsRequest, getRowsResponse, id, licenseKey, masterDetail, paginationGoTo, paginationInfo, persisted_props, persistence, persistence_type, resetColumnState, rowClass, rowClassRules, rowData, rowModelType, rowStyle, rowTransaction, scrollTo, selectAll, selectedRows, style, suppressDragLeaveHidesColumns, updateColumnState, virtualRowData

Could you please help me?

Best,
Yoann

Hi @yoann_diep

It’s unfortunate that LLMs just makes up answers. The Plotly AI was trained on the Plotly and Dash docs, but as you noted, the getContextMenuITems is not yet included in the documentation.

In the meantime, see the following post for 2 examples and links to the upstream AG Grid docs for more information.

Not also that the Context Menu is an AG Grid Enterprise feature

Thank you very much @AnnMarieW !

1 Like