Prevent closing of sub-menu in kendo context menu until user hovers on another menu item or clicks outside/another menu item

Question

Please refer this sample : https://dojo.telerik.com/Eqali

Since sub-items are quite small in length so on hovering over the menu, sub-menu quickly closes as it loses focus. My requirement is that once a sub-menu is opened, it should not close until user hover on another menu item or clicks on an item. It should remain opened even if mouse focus leaves the sub-menu just like it works in explorer context menu as shown in image below:

I have made some more changes and have almost achieved the desired results as can be seen in following sample: https://dojo.telerik.com/Eqali/2 But here the issue is if I hover over a menu-item that does not have any children, then already opened sub-menu item does not get closed until its hoverDelay is fired.

Any suggestions on how can this be achieved ?

Answer 1

Kendo has slightly changed it's Contextmenu options: You can now add the 'openOnClick' option to 'subMenuItems' and 'rootMenuItems':

openOnClick: { 
 subMenuItems: true,
 rootMenuItems: true
}

http://docs.telerik.com/kendo-ui/api/javascript/ui/menu#configuration-openOnClick

Maybe this helps for you!