Skip to main content
All docs
V24.2

DevExpress v24.2 Update — Your Feedback Matters

Our What's New in v24.2 webpage includes product-specific surveys. Your response to our survey questions will help us measure product satisfaction for features released in this major update and help us refine our plans for our next major release.

Take the survey Not interested

IContextMenuItem Interface

An item of the built-in context menu in the Rich Text Editor.

Namespace: DevExpress.Blazor.Office

Assembly: DevExpress.Blazor.v24.2.dll

NuGet Package: DevExpress.Blazor

#Declaration

C#
public interface IContextMenuItem

#Remarks

The IContextMenuItem interface defines an item in the built-in context menu. Use interface properties to specify the item’s availability, appearance, and behavior.

The following code snippet customizes context menu items:

<DxRichEdit CustomizeContextMenu=OnCustomizeContextMenu />

@code {
    DxPopup popup;
    Selection selection;
    string textToSearch;
    string link;
    // ...
    async Task OnCustomizeContextMenu(IContextMenuItemCollection items) {
        if (selection.Intervals[0].Length > 0) {
            var span = await selection.ActiveSubDocument.GetTextSpanAsync(selection.Intervals[0]);
            textToSearch = span.Text.Trim();
        }
        else
            textToSearch = null;
        var searchItem = items.AddCustomItem(0, "Google Search...", async () => {
            var url = $"https://www.google.com/search?q={HttpUtility.UrlEncode(textToSearch)}";
            await JSRuntime.InvokeVoidAsync("open", url, "_blank");
        });
        searchItem.Enabled = !string.IsNullOrEmpty(textToSearch);
        searchItem.IconCssClass = "search-icon";
        var hyperlinks = await selection.ActiveSubDocument.Hyperlinks.GetAllAsync();
        var hyperlink = hyperlinks.SingleOrDefault(h => Enumerable.Range(h.Interval.Start, h.Interval.Length).Contains(selection.CaretPosition));
        link = hyperlink?.Url;
        if (!string.IsNullOrEmpty(link)) {
            var openHyperlinkItem = items[RichEditContextMenuItemNames.OpenHyperlink];
            openHyperlinkItem.BeginGroup = false;
            var index = items.IndexOf(openHyperlinkItem);
            var showURLItem = items.AddCustomItem(index, "Show URL");
            showURLItem.Click = async () => {
                if (popup is not null)
                    await popup.ShowAsync();
            };
            showURLItem.BeginGroup = true;
        }
        items.Remove(RichEditContextMenuItemNames.CutSelection);
        items.Remove(RichEditContextMenuItemNames.CopySelection);
        items.Remove(RichEditContextMenuItemNames.Paste);
        var clipboardItem = items.AddCustomItem(1, "Clipboard");
        clipboardItem.BeginGroup = true;
        clipboardItem.Items.Add(RichEditContextMenuItemNames.CutSelection);
        clipboardItem.Items.Add(RichEditContextMenuItemNames.CopySelection);
        clipboardItem.Items.Add(RichEditContextMenuItemNames.Paste);
    }
}

customize-contextmenu-items

Run Demo: Context Menu Customization

See Also