Class SfContextMenu<TValue>

ContextMenu is a graphical user interface that appears on the user right click/touch hold operation.

Inheritance
object
ComponentBase
OwningComponentBase
SfOwningComponentBase
SfBaseComponent
SfMenuBase<TValue>
SfContextMenu<TValue>
Implements
Inherited Members
Namespace: Syncfusion.Blazor.Navigations
Assembly: Syncfusion.Blazor.dll
Syntax
public class SfContextMenu<TValue> : SfMenuBase<TValue>, IComponent, IHandleEvent, IHandleAfterRender, IDisposable
Type Parameters
Name
TValue
Examples

In the below code example, showcases a basic context menu.

<SfContextMenu Target="#contextmenutarget" TValue="MenuItem">
<MenuItems>
<MenuItem Text="Cut" IconCss="e-cm-icons e-cut"></MenuItem>
<MenuItem Text="Copy" IconCss="e-cm-icons e-copy"></MenuItem>
<MenuItem Text="Paste" IconCss="e-cm-icons e-paste"></MenuItem>
</MenuItems>
</SfContextMenu>

In the below code example, showcases a basic context menu.

<SfContextMenu Target="#contextmenutarget" TValue="MenuItem">
<MenuItems>
<MenuItem Text="Cut" IconCss="e-cm-icons e-cut"></MenuItem>
<MenuItem Text="Copy" IconCss="e-cm-icons e-copy"></MenuItem>
<MenuItem Text="Paste" IconCss="e-cm-icons e-paste"></MenuItem>
</MenuItems>
</SfContextMenu>

Constructors

SfContextMenu()

Declaration
public SfContextMenu()

Properties

CloseActionEvents

Gets or sets a value that indicates an event to close the context menu.

Declaration
[Parameter]
public string CloseActionEvents { get; set; }
Property Value
Type Description
string

Accepts a string value. The default value is mousedown, touchstart.
Remarks

The list of events supports to close the context menu are mousedown, mouseup, click, touchstart, mouseleave, touchend. The event must be different from OpenActionEvents.

Examples

In the below code example, contextmenu event is set to close the context menu.

<div id="target">Right click or touch hold to open the context menu.</div>
<SfContextMenu Target="#target" TValue="MenuItem" CloseActionEvents=”CloseAction”>
<MenuItems>
    <MenuItem Text="Cut"></MenuItem>
    <MenuItem Text="Copy"></MenuItem>
    <MenuItem Text="Paste"></MenuItem>
</MenuItems>
</SfContextMenu>
@code {
    private string CloseAction = “mousedown touchstart”;
}

Filter

Gets or sets a value that indicates the filter selector in which element the context menu should be opened inside the sepcified target.

Declaration
[Parameter]
public string Filter { get; set; }
Property Value
Type Description
string

Accepts the string value. The default value is empty.

HtmlAttributes

Gets or sets a value that indicates the additional HTML attributes such as style, title etc., to the context menu.

Declaration
[Parameter(CaptureUnmatchedValues = true)]
public Dictionary<string, object> HtmlAttributes { get; set; }
Property Value
Type
Dictionary<string, object>

OpenActionEvents

Gets or sets a value that indicates an event to open the context menu.

Declaration
[Parameter]
public string OpenActionEvents { get; set; }
Property Value
Type Description
string

Accepts a string value. The default value is contextmenu.
Remarks

The list of events supports to open the context menu are contextmenu, mousedown, mouseup, touchstart, mouseleave etc. The event must be different from CloseActionEvents.

Examples

In the below code example, contextmenu event is set to open the context menu.

<div id="target">Right click or touch hold to open the context menu.</div>
<SfContextMenu Target="#target" TValue="MenuItem" OpenActionEvents=”OpenAction”>
<MenuItems>
    <MenuItem Text="Cut"></MenuItem>
    <MenuItem Text="Copy"></MenuItem>
    <MenuItem Text="Paste"></MenuItem>
</MenuItems>
</SfContextMenu>
@code {
    private string OpenAction = “contextmenu”;
}

Target

Gets or sets a value that indicates the target element selector in which the context menu should be opened.

Declaration
[Parameter]
public string Target { get; set; }
Property Value
Type Description
string

Accepts the string value. The default value is empty.

Methods

BuildRenderTree(RenderTreeBuilder)

Declaration
protected override void BuildRenderTree(RenderTreeBuilder __builder)
Parameters
Type Name Description
RenderTreeBuilder __builder
Overrides

Close()

Closes the context menu if it is opened.

Declaration
public void Close()

OnAfterRenderAsync(bool)

Method invoked after each time the component has been rendered.

Declaration
protected override Task OnAfterRenderAsync(bool firstRender)
Parameters
Type Name Description
bool firstRender

Set to true for the first time component rendering; otherwise gets false.
Returns
Type Description
Task

A System.Threading.Tasks.Task representing any asynchronous operation.
Overrides

OnInitializedAsync()

Method invoked when the component is ready to start.

Declaration
protected override Task OnInitializedAsync()
Returns
Type Description
Task

A System.Threading.Tasks.Task representing any asynchronous operation.
Overrides
Syncfusion.Blazor.Navigations.Internal.SfMenuBase<TValue>.OnInitializedAsync()

OnParametersSetAsync()

Declaration
protected override Task OnParametersSetAsync()
Returns
Type
Task
Overrides
Syncfusion.Blazor.Navigations.Internal.SfMenuBase<TValue>.OnParametersSetAsync()

OpenAsync(double?, double?, bool)

Opens the context menu at a particular location on the screen, determined by the specified x and y coordinates. If coordinates are not specified, the context menu will appear at its default position.

Declaration
public Task OpenAsync(double? clientX = null, double? clientY = null, bool enableCollision = false)
Parameters
Type Name Description
double? clientX

Specifies the client x position of the context menu.
double? clientY

Specifies the client y position of the context menu.
bool enableCollision

Set true/false to enable/disable the collision detection of the context menu.
Returns
Type Description
Task

A Task that represents the asynchronous operation of opening a context menu. It completes when the component has finished the action.

Implements