Adicionando menus suspensos ao jqGrid - javascript, jquery, jquery-ui, jqgrid, jquery-ui-menu

Eu estou trabalhando em portar um aplicativo WinForm para o navegador e gostaria de manter a capacidade de ter um conjunto de menus suspensos no topo (dentro da barra de ferramentas) do jqGrid.

Eu sou capaz de criar um barra de ferramentas personalizada para o topo da grade sem clonar a parte inferior e, portanto, ter botões de ação. Eu também sou capaz de clonar o navegador existente.

O que eu estou perdendo é como ter uma dessas duas opções incorporando um sistema de menu como jQuery UI Menu. O código abaixo adicionará o menu à barra de ferramentas, mas o menu ficará oculto atrás da grade. Eu tentei ajustar o z-index e posição, mas nem parecia resolvê-lo.

toolbar: [true,"top"];
...
$("#toolbarId").append("<ul id="myMenu"><li><a href="#">File</a><ul><li>"+
"<a href="#">New</a></li><li><a href="#">Delete</a></li></ul></li></ul>");
$("#myMenu").menu();

Qualquer ajuda é apreciada. THX.

Respostas:

Eu sugiro que você use posição opção de jQuery UI Menu Widget. Você pode usar using callback (ver documentação do jQuery UI Position) para alterar as propriedades do submenu.

Apenas tente por exemplo

$("#myMenu").menu({position: {
of: "#gview_" + $grid[0].id,
my: "left top",
at: "left top",
using: function (props, feedback) {
$(this).css({top: (props.top + 25), left: (props.left + 50), zIndex: 1005});
}
}}).css("width", "50px");

Onde var $grid = $("#grid"); - sua grade. Você verá as possibilidades que você tem.