Planned
Last Updated: 02 Oct 2023 06:25 by ADMIN
Scheduled for 4.6.0 (11 Oct 2023) (R3 2023)
Will
Created on: 20 May 2021 13:17
Category: Window
Type: Bug Report
9
The ContextMenu is hidden behind the Modal Window

When I try to add a context menu to the content in the Modal Window the context menu stays behind the modal.

===

A possible workaround is to increase the z-index of the ContextMenu:

<TelerikContextMenu Data="@MenuItems" Selector="#menu-target"
                    Class="menu-on-top" />

<style>
    .menu-on-top,
    .k-animation-container:has(.menu-on-top) {
        z-index: 11000 !important;
    }
</style>

<TelerikWindow Width="240px" Height="160px"
               Top="100px" Left="100px"
               Visible="true" Modal="true">
    <WindowTitle>Window</WindowTitle>
    <WindowContent>
        <div style="height:60px;border: 1px solid;"
             id="menu-target">Right-click me</div>
    </WindowContent>
</TelerikWindow>

@code {
    List<ContextMenuItem> MenuItems { get; set; } = new List<ContextMenuItem>();

    protected override void OnInitialized()
    {
        for (int i = 1; i <= 7; i++)
        {
            MenuItems.Add(new ContextMenuItem() { Text = $"Menu item {i}" });
        }

        base.OnInitialized();
    }

    public class ContextMenuItem
    {
        public string Text { get; set; } = string.Empty;
    }
}

1 comment
Todd
Posted on: 27 Jun 2023 18:27
This is very helpful thank you! 
The secret sauce of this work-around is the z-index of 11000. The pop-up window has a z-index of 10003 in my case. Setting the z index to anything lower than the window puts it behind the window.