The Kendo context menu does not appear in the modal popup.

[Hemanshu]

Hello,


I'm using a model popup in which I bind the kendo grid and set the grid right-click to open the context menu. However, the context menu does not appear. I'm using Kendo 2023.2.606 version. Please leave your feedback.

This below same code work fine in normal page. But, it's not working in model popup.

Context menu Code is here:

<ul id="clientSearchGridContextMenu" class="hide">
    <li id="clientSearchGridContextMenuAddFavourite"><span class="menu-item k-link">@Resource.lblAddFavourite</span></li>
    <li id="clientSearchGridContextMenuRemoveFavourite" class="border-bottom-div"><span class="menu-item k-link">@Resource.lblRemoveFavourite</span></li>
    <li id="clientSearchGridContextMenuClose"><span class="menu-item k-link">@Resource.lblClose</span></li>
</ul>

 

JavaScript code for context men:

  bindClientSearchGridContextMenu: function (favourites) {
      clientManagement.variable.clientSearchGridContextMenuAddFavourite.css('display', favourites ? 'none' : 'block');
      clientManagement.variable.clientSearchGridContextMenuRemoveFavourite.css('display', favourites ? 'block' : 'none');

      clientManagement.variable.clientSearchGridContextMenu.kendoContextMenu({
          target: "#clientMatterGrid",
          filter: "tbody > tr",
          open: function (e) {
              clientManagement.variable.clientSearchGridContextMenu.addClass("show");
              let node = $(e.target);
              $("#clientMatterGrid").data('kendoGrid').select(node);
          },
          select: function (e) {
              let node = $(e.target);

              $("#clientMatterGrid").data('kendoGrid').select(node);

              switch ($(e.item).attr('id')) {
                  case "clientSearchGridContextMenuAddFavourite":
                      clientManagement.addRemoveFavourite(true);
                      break;
                  case "clientSearchGridContextMenuRemoveFavourite":
                      clientManagement.addRemoveFavourite(false);
                      break;
                  case "clientSearchGridContextMenuClose":
                      clientManagement.variable.clientSearchGridContextMenu.data("kendoContextMenu").close();
                      break;
              }
          }
      });
  }

 

[Nikolay]

Hi

The built-in ContextMenu is available for the Grid as of the 2023 R3 release. 

• https://demos.telerik.com/kendo-ui/grid/context-menu

I recommend upgrading to have it in your project.

Nevertheless, to have the custom ContextMenu working as expected I recommend initializing it after the popup has opened and the Grid has been initialized.

Regards,

Nikolay 

[Hemanshu]

Hi,

I have already tried with the latest version and it is not fixed in there. It's worked fine in normal page. But, not working in model popup.

 

Regards,

Hemanshu

[Nikolay]

Hi Hemanshu,

I just tested the built-in Grid context menu inside a kendo UI Dialog and it is showing as expected:

Here is the Dojo demo I prepared: https://dojo.telerik.com/eQuMihoP

Could you please modify it to showcase the problem so I can investigate further?

Regards,

Nikolay

[Hemanshu]

Hi,

I am using standard Bootstrap ones. The context menu is not working with the Bootstrap popup.

 

Regards,

Hemanshu

[Hemanshu]

Hi,

I am using standard Bootstrap. The context menu is not working with the Bootstrap popup. Can you please provide your feedback on it?

 If you have any examples of the Contextmenu inside the Bootstrap popup please provide me.

Regards,

Hemanshu

[Nikolay]

Hi Hemanshu,

Thank you for clarifying the case.

I created a sample Dojo demo where the Grid is initialized inside a Bootstrap modal and the Context Menu appears to be working as expected.

Dojo demo: https://dojo.telerik.com/onARAXIF

Could you please modify it to showcase the problem so I can investigate further?

Regards,

Nikolay