ContextMenu doesn't work for RadzenPanelMenuItem #966

Closed
opened 2026-01-29 17:47:02 +00:00 by claunia · 0 comments
Owner

Originally created by @Just3F on GitHub (Aug 25, 2023).

Describe the bug
ContextMenu method cannot be called after right-clicking.

To Reproduce
Steps to reproduce the behavior:

  1. Go to (https://blazor.radzen.com/panelmenu)
  2. And modify code. Just add ContextMenu to RadzenPanelMenuItem
  3. Run
  4. Try right-click on item. Menu will not opened.

Code sample:

@inject ContextMenuService ContextMenuService

<RadzenStack AlignItems="AlignItems.Center" Class="rz-p-12">
    <RadzenStack Orientation="Orientation.Horizontal" AlignItems="AlignItems.Center" Gap="0.5rem">
        <RadzenCheckBox @bind-Value=@multiple Name="CheckBox1" TValue="bool" />
        <RadzenLabel Text="Allow multiple expand" Component="CheckBox1" />
    </RadzenStack>

    <RadzenPanelMenu Click="OnParentClicked" Style="width:300px" Multiple="@multiple">
        <RadzenPanelMenuItem Text="General" Icon="home" >
            <RadzenPanelMenuItem Text="Buttons" Path="buttons" Icon="account_circle" ContextMenu=@(args => ShowContextMenuWithItems(args)) ></RadzenPanelMenuItem>
            <RadzenPanelMenuItem Text="Menu" Path="menu" Icon="line_weight"></RadzenPanelMenuItem>
            <RadzenPanelMenuItem Text="FileInput" Path="fileinput" Icon="attach_file"></RadzenPanelMenuItem>
            <RadzenPanelMenuItem Text="Dialog" Path="dialog" Icon="perm_media"></RadzenPanelMenuItem>
            <RadzenPanelMenuItem Text="Notification" Path="notification" Icon="announcement"></RadzenPanelMenuItem>
        </RadzenPanelMenuItem>
        <RadzenPanelMenuItem Text="Inputs" Icon="payment">
            <RadzenPanelMenuItem Text="CheckBox" Path="checkbox" Icon="check_circle"></RadzenPanelMenuItem>
            <RadzenPanelMenuItem Text="TextBox" Path="textbox" Icon="input"></RadzenPanelMenuItem>
            <RadzenPanelMenuItem Text="TextArea" Path="textarea" Icon="description"></RadzenPanelMenuItem>
            <RadzenPanelMenuItem Text="Password" Path="password" Icon="payment"></RadzenPanelMenuItem>
            <RadzenPanelMenuItem Text="Numeric" Path="numeric" Icon="aspect_ratio"></RadzenPanelMenuItem>
            <RadzenPanelMenuItem Text="DatePicker" Path="datepicker" Icon="date_range"></RadzenPanelMenuItem>
        </RadzenPanelMenuItem>
        <RadzenPanelMenuItem Text="Data" Icon="save">
            <RadzenPanelMenuItem Text="DataGrid" Path="datagrid" Icon="grid_on"></RadzenPanelMenuItem>
            <RadzenPanelMenuItem Text="DataList" Path="datalist" Icon="list"></RadzenPanelMenuItem>
            <RadzenPanelMenuItem Text="DropDown" Path="dropdown" Icon="dns"></RadzenPanelMenuItem>
            <RadzenPanelMenuItem Text="DropDownDataGrid" Path="dropdown-datagrid" Icon="receipt"></RadzenPanelMenuItem>
            <RadzenPanelMenuItem Text="ListBox" Path="listbox" Icon="view_list"></RadzenPanelMenuItem>
            <RadzenPanelMenuItem Text="TemplateForm" Path="templateform" Icon="line_style"></RadzenPanelMenuItem>
        </RadzenPanelMenuItem>
        <RadzenPanelMenuItem Text="Containers" Icon="account_box">
            <RadzenPanelMenuItem Text="Tabs" Path="tabs" Icon="tab"></RadzenPanelMenuItem>
            <RadzenPanelMenuItem Text="Panel" Path="panel" Icon="content_paste"></RadzenPanelMenuItem>
            <RadzenPanelMenuItem Text="Fieldset" Path="fieldset" Icon="account_balance_wallet"></RadzenPanelMenuItem>
            <RadzenPanelMenuItem Text="Card" Path="card" Icon="line_style"></RadzenPanelMenuItem>
        </RadzenPanelMenuItem>
        <RadzenPanelMenuItem Text="More">
            <RadzenPanelMenuItem Click="OnChildClicked" Text="Item1"></RadzenPanelMenuItem>
            <RadzenPanelMenuItem Click="OnChildClicked" Text="Item2"></RadzenPanelMenuItem>
            <RadzenPanelMenuItem Text="More items">
                <RadzenPanelMenuItem Text="More sub items">
                    <RadzenPanelMenuItem Click="OnChildClicked" Text="Item3"></RadzenPanelMenuItem>
                    <RadzenPanelMenuItem Click="OnChildClicked" Text="Item4"></RadzenPanelMenuItem>
                </RadzenPanelMenuItem>
            </RadzenPanelMenuItem>
        </RadzenPanelMenuItem>
    </RadzenPanelMenu>

</RadzenStack>
<EventConsole @ref=@console />
@code {
    bool multiple = true;
    EventConsole console;
    
    void OnParentClicked(MenuItemEventArgs args)
    {
        console.Log($"{args.Text} clicked from parent");
    }

    void OnChildClicked(MenuItemEventArgs args)
    {
        console.Log($"{args.Text} from child clicked");
    }

    void ShowContextMenuWithItems(MouseEventArgs args)
    {
        ContextMenuService.Open(args,
            new List<ContextMenuItem> {
                new ContextMenuItem(){ Text = "Context menu item 1", Value = 1, Icon = "home" },
                new ContextMenuItem(){ Text = "Context menu item 2", Value = 2, Icon = "search" },
                new ContextMenuItem(){ Text = "Context menu item 3", Value = 3, Icon = "info" },
         }, OnMenuItemClick);
    }

    void OnMenuItemClick(MenuItemEventArgs args)
    {
        console.Log($"Menu item with Value={args.Value} clicked");
        if(!args.Value.Equals(3) && !args.Value.Equals(4))
        {
            ContextMenuService.Close();
        }
    }
}

Expected behavior
Context menu is opened. Event was handled.

Screenshots

Desktop (please complete the following information):

  • Windows 11
  • chrome
  • Version 116.0.5845.111

Additional context

Originally created by @Just3F on GitHub (Aug 25, 2023). **Describe the bug** ContextMenu method cannot be called after right-clicking. **To Reproduce** Steps to reproduce the behavior: 1. Go to (https://blazor.radzen.com/panelmenu) 2. And modify code. Just add ContextMenu to RadzenPanelMenuItem 3. Run 5. Try right-click on item. Menu will not opened. Code sample: ``` @inject ContextMenuService ContextMenuService <RadzenStack AlignItems="AlignItems.Center" Class="rz-p-12"> <RadzenStack Orientation="Orientation.Horizontal" AlignItems="AlignItems.Center" Gap="0.5rem"> <RadzenCheckBox @bind-Value=@multiple Name="CheckBox1" TValue="bool" /> <RadzenLabel Text="Allow multiple expand" Component="CheckBox1" /> </RadzenStack> <RadzenPanelMenu Click="OnParentClicked" Style="width:300px" Multiple="@multiple"> <RadzenPanelMenuItem Text="General" Icon="home" > <RadzenPanelMenuItem Text="Buttons" Path="buttons" Icon="account_circle" ContextMenu=@(args => ShowContextMenuWithItems(args)) ></RadzenPanelMenuItem> <RadzenPanelMenuItem Text="Menu" Path="menu" Icon="line_weight"></RadzenPanelMenuItem> <RadzenPanelMenuItem Text="FileInput" Path="fileinput" Icon="attach_file"></RadzenPanelMenuItem> <RadzenPanelMenuItem Text="Dialog" Path="dialog" Icon="perm_media"></RadzenPanelMenuItem> <RadzenPanelMenuItem Text="Notification" Path="notification" Icon="announcement"></RadzenPanelMenuItem> </RadzenPanelMenuItem> <RadzenPanelMenuItem Text="Inputs" Icon="payment"> <RadzenPanelMenuItem Text="CheckBox" Path="checkbox" Icon="check_circle"></RadzenPanelMenuItem> <RadzenPanelMenuItem Text="TextBox" Path="textbox" Icon="input"></RadzenPanelMenuItem> <RadzenPanelMenuItem Text="TextArea" Path="textarea" Icon="description"></RadzenPanelMenuItem> <RadzenPanelMenuItem Text="Password" Path="password" Icon="payment"></RadzenPanelMenuItem> <RadzenPanelMenuItem Text="Numeric" Path="numeric" Icon="aspect_ratio"></RadzenPanelMenuItem> <RadzenPanelMenuItem Text="DatePicker" Path="datepicker" Icon="date_range"></RadzenPanelMenuItem> </RadzenPanelMenuItem> <RadzenPanelMenuItem Text="Data" Icon="save"> <RadzenPanelMenuItem Text="DataGrid" Path="datagrid" Icon="grid_on"></RadzenPanelMenuItem> <RadzenPanelMenuItem Text="DataList" Path="datalist" Icon="list"></RadzenPanelMenuItem> <RadzenPanelMenuItem Text="DropDown" Path="dropdown" Icon="dns"></RadzenPanelMenuItem> <RadzenPanelMenuItem Text="DropDownDataGrid" Path="dropdown-datagrid" Icon="receipt"></RadzenPanelMenuItem> <RadzenPanelMenuItem Text="ListBox" Path="listbox" Icon="view_list"></RadzenPanelMenuItem> <RadzenPanelMenuItem Text="TemplateForm" Path="templateform" Icon="line_style"></RadzenPanelMenuItem> </RadzenPanelMenuItem> <RadzenPanelMenuItem Text="Containers" Icon="account_box"> <RadzenPanelMenuItem Text="Tabs" Path="tabs" Icon="tab"></RadzenPanelMenuItem> <RadzenPanelMenuItem Text="Panel" Path="panel" Icon="content_paste"></RadzenPanelMenuItem> <RadzenPanelMenuItem Text="Fieldset" Path="fieldset" Icon="account_balance_wallet"></RadzenPanelMenuItem> <RadzenPanelMenuItem Text="Card" Path="card" Icon="line_style"></RadzenPanelMenuItem> </RadzenPanelMenuItem> <RadzenPanelMenuItem Text="More"> <RadzenPanelMenuItem Click="OnChildClicked" Text="Item1"></RadzenPanelMenuItem> <RadzenPanelMenuItem Click="OnChildClicked" Text="Item2"></RadzenPanelMenuItem> <RadzenPanelMenuItem Text="More items"> <RadzenPanelMenuItem Text="More sub items"> <RadzenPanelMenuItem Click="OnChildClicked" Text="Item3"></RadzenPanelMenuItem> <RadzenPanelMenuItem Click="OnChildClicked" Text="Item4"></RadzenPanelMenuItem> </RadzenPanelMenuItem> </RadzenPanelMenuItem> </RadzenPanelMenuItem> </RadzenPanelMenu> </RadzenStack> <EventConsole @ref=@console /> @code { bool multiple = true; EventConsole console; void OnParentClicked(MenuItemEventArgs args) { console.Log($"{args.Text} clicked from parent"); } void OnChildClicked(MenuItemEventArgs args) { console.Log($"{args.Text} from child clicked"); } void ShowContextMenuWithItems(MouseEventArgs args) { ContextMenuService.Open(args, new List<ContextMenuItem> { new ContextMenuItem(){ Text = "Context menu item 1", Value = 1, Icon = "home" }, new ContextMenuItem(){ Text = "Context menu item 2", Value = 2, Icon = "search" }, new ContextMenuItem(){ Text = "Context menu item 3", Value = 3, Icon = "info" }, }, OnMenuItemClick); } void OnMenuItemClick(MenuItemEventArgs args) { console.Log($"Menu item with Value={args.Value} clicked"); if(!args.Value.Equals(3) && !args.Value.Equals(4)) { ContextMenuService.Close(); } } } ``` **Expected behavior** Context menu is opened. Event was handled. **Screenshots** - **Desktop (please complete the following information):** - Windows 11 - chrome - Version 116.0.5845.111 **Additional context** -
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: starred/radzen-blazor#966