Search code examples
jqueryjqgridz-indexwijmo

z-Index Issue with jqGrid and Wijmo WijMenu


I am trying to use the jQuery-based Wijmo WijMenu control with jqGrid in order to create a dynamic grid toolbar.

enter image description here

Getting the menu to appear works fine. However, my menuitem1 has a submenu, and this submenu falls behind the jqGrid when I hover over 'menuitem1'.

I've tried setting the z-Index on the menu and the individual menu items, but with no luck. This behavior happens on IE9, Chrome, FF and Safari. It does work when I turn compatibility mode on with IE9, which makes me think it may have something to do with the z-index...but I'm not sure. I feel like I'm missing something obvious.

I created a jsFiddle to demonstrate my issue.

Can anyone help me get the submenu to fall in front of the jqGrid?

Thank you in advance for any help/advice.


Solution

  • It's not a z-index issue. The .ui-jqgrid .ui-userdata has overflow:hidden on it. Try making it overflow: visible.

    Although I'm not sure if it will cause problems on the grid when doing this.