Blazor ContextMenu - Overview

The Telerik UI for Blazor Context Menu component provides users with an easily accessible shortcut menu of frequently used commands. To use it in Blazor applications, you need to add the <TelerikContextMenu> tag to your razor page and set its Selector parameter to a CSS selector that will match the element(s) you want to attach the context menu to. Then, to populate the menu items, you need to provide a collection of models to its Data property and handle the OnClick event to respond to the user action. You can further add an image, icon class or a font icon for each item in the Context Menu to illustrate its purpose for your users.

The Blazor Context Menu supports binding to hierarchical data (separate collections of items and their child items) and flat data (a single collection of items with defined parent-child relationships).

To customize the appearance and behavior of the context menu, you can take advantage of the built-in options for item and content templates. The templating feature allows you to have full control of the rendering of the entire popup and each individual content menu item.

The power of the Telerik Context Menu comes when it is integrated with other Telerik Blazor components that support the ContextMenu event, such as the Data Grid, TreeList, Scheduler and TreeView. To integrate the ContextMenu with the Telerik Grid, you need to use the Grid OnRowContextMenu event to get the current row model and show the menu, then handle the desired operation in the ContextMenu OnClick event.