Radzen Context Menu issue

Radzen.Blazor Components
1

Hi there,

confused as to why the Radzen menu renders horizontally versus vertically depending on how you call it (directly on page vs. through the contextmenuservice); is there a way to get this

<RadzenMenu Click="OnMenuItemClick">
            <RadzenMenuItem Text="Item1" Value="1"></RadzenMenuItem>
            <RadzenMenuItem Text="Item2" Value="2"></RadzenMenuItem>
            <hr />
            <RadzenMenuItem Text="More items" Value="3">
                <RadzenMenuItem Text="More sub items" Value="4">
                    <RadzenMenuItem Text="Item1" Value="5"></RadzenMenuItem>
                    <RadzenMenuItem Text="Item2" Value="6"></RadzenMenuItem>
                </RadzenMenuItem>
            </RadzenMenuItem>
        </RadzenMenu>

to render the same (ie. Vertically) as this

void ShowContextMenuWithContent(MouseEventArgs args) => ContextMenuService.Open(args, ds =>
        @<RadzenMenu Click="OnMenuItemClick">
            <RadzenMenuItem Text="Item1" Value="1"></RadzenMenuItem>
            <RadzenMenuItem Text="Item2" Value="2"></RadzenMenuItem>
            <hr />
            <RadzenMenuItem Text="More items" Value="3">
                <RadzenMenuItem Text="More sub items" Value="4">
                    <RadzenMenuItem Text="Item1" Value="5"></RadzenMenuItem>
                    <RadzenMenuItem Text="Item2" Value="6"></RadzenMenuItem>
                </RadzenMenuItem>
            </RadzenMenuItem>
        </RadzenMenu>);
2

If you wrap the first menu in a div with class="rz-context-menu":

image
image1920×1080 207 KB

You will get vertical menu:

image
image1920×1080 129 KB

3

Thanks! My example revolves around launching a context menu from a datagrid. However the menu doesn't show up. I used your boilerplate example from the docs in the context of a datagrid:

<RadzenDataGrid Data="_errors"
                ContextMenu="@(args => ShowMenu(args))"
                @ref="_errorsGrid"
                @bind-Settings="_errorsGridSettings"
                AllowFiltering="true"
                FilterMode="FilterMode.SimpleWithMenu"
                FilterCaseSensitivity="FilterCaseSensitivity.CaseInsensitive"
                AllowSorting="true"
                AllowVirtualization="true"
                Style="min-height: 400px; height: calc(85vh - 18rem)">
{columns omitted for brevity.....}
@code{
 void ShowMenu(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", Disabled = true },
             new ContextMenuItem(){ Text = "Context menu item 3", Value = 3, Icon = "info" },
      }, OnMenuItemClick);
 }

 void OnMenuItemClick(MenuItemEventArgs args)
 {

     if (!args.Value.Equals(3) && !args.Value.Equals(4))
     {
         ContextMenuService.Close();
     }
 }

however nothing comes up when I rightclick the grid. the default browser menu is overridden though as that does not come up. Any help would be appreciated