Search results

Change Menu Item Dynamically

The items visible in the Context Menu can be changed dynamically based on the target. To achieve this behavior, initialize Context Menu with all items using Items property and then you can Hide/Show items using HideItems/ShowItems method in OnOpen event.

@using Syncfusion.Blazor.Navigations

<div id="target">Right click/Touch hold to open the ContextMenu </div>
<SfContextMenu Target="#target" Items="MenuItems" @ref="ContextMenuObj">
    <ContextMenuEvents OnOpen="Open"></ContextMenuEvents>
</SfContextMenu>

@code {
    SfContextMenu ContextMenuObj;
    public List<MenuItem> MenuItems = new List<MenuItem>
    {
        new MenuItem{ Text = "Cut" },
        new MenuItem{ Text = "Copy" },
        new MenuItem{ Text = "Paste" },
        new MenuItem{ Text = "Add" },
        new MenuItem{ Text = "Edit" },
        new MenuItem{ Text = "Delete" }
    };

    public void Open(BeforeOpenCloseMenuEventArgs args)
    {
        this.MenuObj.HideItems(new string[] { "Cut", "Copy", "Paste" });
    }
}

<style>
    #target {
        border: 1px dashed;
        height: 150px;
        padding: 10px;
        position: relative;
        text-align: justify;
        color: gray;
        user-select: none;
    }
</style>

Output be like

Context Menu Sample