Open and Close Context Menu in Blazor ContextMenu Component

28 Dec 20231 minute to read

Open and close the Context Menu manually whenever required by using the Open and Close methods. In the following sample, the Context Menu manually opens while clicking the button using Open method with ClientX and ClientY coordinates.

To manually close the Context Menu, Close method can be used.

@using Syncfusion.Blazor.Navigations
@using Syncfusion.Blazor.Buttons

<div id="target">
    <SfContextMenu @ref="contextMenuObj" TValue="MenuItem">
        <MenuItems>
            <MenuItem Text="Cut"></MenuItem>
            <MenuItem Text="Copy"></MenuItem>
            <MenuItem Text="Paste"></MenuItem>
        </MenuItems>
    </SfContextMenu>
    <SfButton @onclick="OpenContextMenu">Open ContextMenu</SfButton>
</div>

@code {
    SfContextMenu<MenuItem> contextMenuObj;
    private void OpenContextMenu(MouseEventArgs e)
    {
        contextMenuObj.Open(e.ClientX, e.ClientY);
    }
}

Blazor ContextMenu displays Dialog Menu