Context Menu

Updated on Apr 16, 2026

The Kendo UI for Vue Data Grid enables you to display a context menu by using the built-in Context Menu component. The onContextMenu event is fired when grid cells are rendered and the context menu is triggered on a right click.

The built-in context menu of the Grid allows you to control the rows selection and the column sorting. To enable it you should:

1. Set the contextMenu prop of the Grid to true to enable the ContextMenu component.

2. Enable the selectable prop to allow rows selection.

3. (Optional) Set the sortable prop to true to allow column sorting, and take care of the built-in sort state.

4. (Optional) Add a column with columnType="checkbox" to render a checkbox selection column.

html

<Grid
    :context-menu="true"
    :sortable="true"
    :selectable="{ enabled: true }"
    :columns="columns"
>
</Grid>

You can see the default Context menu of the Grid in action in the demo below.

Change Theme

Theme

Loading ...

Suggested Links

• Vue Data Grid Excel Export
• Vue Data Grid PDF Export
• API Reference of the Grid