RadMenu dynamically placed on Grid Pager - dropdown cut off

[Timothy]

Hi I have created a RadMenu dynamically on a Grid Pager the RadGrid has the following properties:-
<telerik:RadGrid ID="theGridView" runat="server"
   AllowPaging="True" AllowSorting="True" AllowFilteringByColumn="True" AllowAutomaticDeletes="True" CellSpacing="0"
   DataSourceID="theSqlDataSource" CssClass="gridview" Width="100%"
   AutoGenerateColumns="False" EnableHeaderContextFilterMenu="True"
   EnableHeaderContextMenu="True" ShowStatusBar="True" Skin="Windows7" ShowGroupPanel="true" GroupPanel-CssClass="hideGroupPanel" Culture="en-NZ"
   onitemdatabound="theGridView_ItemDataBound"
   OnItemCreated="theGridView_ItemCreated" onitemdeleted="theGridView_ItemDeleted">
   <ClientSettings AllowColumnsReorder="True" AllowDragToGroup="True" ReorderColumnsOnClient="True">
      <Scrolling AllowScroll="True" UseStaticHeaders="True" />
      <Resizing AllowColumnResize="True" AllowResizeToFit="True" EnableRealTimeResize="True" ResizeGridOnColumnResize="true" />
   </ClientSettings>
etc.
<PagerStyle AlwaysVisible="True" />
</MasterTableView>
<PagerStyle AlwaysVisible="True" />
<FilterMenu EnableImageSprites="True" />
</telerik:RadGrid>

The Menu is created using code in the RadGrid_ItemCreated event when the item is a GridPagerItem with the following code:-
RadMenu gridOptionsMenu = new RadMenu();
gridOptionsMenu.OnClientItemOpening = "GridMenuItemOpened";
gridOptionsMenu.ID = "gridOptionsMenu";
gridOptionsMenu.ExpandAnimation.Type = AnimationType.None;
RadMenuItem gridOptionMain = new RadMenuItem("Options");
RadMenuItem gridOptionTemplate = new RadMenuItem("");
gridOptionTemplate.Width = 300;
gridOptionMain.Items.Add(gridOptionTemplate);
gridOptionsMenu.Items.Add(gridOptionMain);
gridOptionsDiv.Controls.Add(gridOptionsMenu);
GridOptionsTemplate template = new GridOptionsTemplate();
foreach (RadMenuItem menuitem in gridOptionsMenu.GetAllItems())
{
   if (menuitem.Level > 0)
   {
      template.InstantiateIn(menuitem);
      template.SetValues(menuitem, theGridView.ClientID, theGridView.MasterTableView.IsFilterItemExpanded, false);
   }
}

the menu is shown when clicking the Options Menu item but is shown cut off as shown.

I have trued various css hacks and changing zIndex of various elements on the OnClientItemOpening in javascript but have got nowhere. What started out as a good idea and I thought reasonably easy to implement has turned into a few hours of frustration.

Please give me a hint on how to achieve this.

[Kate]

Hi Timothy,

The issue that you encounter is not related to the z-index of the controls but rather to the visibility property that is assigned to the different elements of the RadGrid control. You will need to get the correct css class selector and overwrite it by setting visibility property to visible (you can use FireBug tool of FireFox to get the correct css class selector). If this does not help I would ask you a live url that I can test locally and help you out in your particular case.

Greetings,
Kate
the Telerik team