JavaScript error when retrieving context menu

[Menna]

hi,
 i am working with trial version of Rad Controls for Asp.NET AJAX. and migrating from ASP controls.I am supposed to evaluate the needed changes and the telerik controls for future purchasing, but unfortunately i have two problems with the rad menu, I am using rad grid and attaching context menu to it on RowContextMenu  event which is handled by javascript fn.
First problem:
The index is always object
The menu var is always object and an error: "object doesn't support method or property"
Here's my html Code
Thanks in advance

<script language="javascript" >
          function RowContextMenu( index,e)
            {
                  document.getElementById("radGridClickedRowIndex").value = index;
                  var menu = <%= gvBrowseContextMenu.ClientID %>;
                  alert(menu);
alert(index.tostring());

                  menu.Show(e);
               
                e.cancelBubble = true;
                e.returnValue = false;

                if (e.stopPropagation)
                {
                   e.stopPropagation();
                   e.preventDefault();
                }
                this.SelectRow(this.Rows[1].Control, true);
            }
         </script>

<telerik:RadContextMenu ID="gvBrowseContextMenu" runat= "server" IsContext="True" Skin="Outlook"  ExpandDelay="10" OnItemClick="gvBrowseContextMenu_OnItemClick" ContextMenuElementID="none">
                        <CollapseAnimation Duration="200" Type="OutQuint" />
                        <Items>
                            <telerik:RadMenuItem runat="server" Text="Edit">
                            </telerik:RadMenuItem>
                            <telerik:RadMenuItem runat="server" Text="Delete">
                            </telerik:RadMenuItem>
                        </Items>
                 </telerik:RadContextMenu>
                <input type="hidden" id="radGridClickedRowIndex" name="radGridClickedRowIndex" />
           
                <telerik:RadGrid ID="gvBrowse" runat="server" AllowFilteringByColumn="True" AllowPaging="True"
                    AllowSorting="True" BorderWidth="0px" CellSpacing="1" GridLines="None" Height="217px"
                    MasterTableView-DataKeyNames="InvoiceNumber" OnPageIndexChanged="gvBrowse_PageIndexChanging"
                    OnPreRender="gvBrowse_PreRender" PagerStyle-CssClass="es_grid_pager" ShowStatusBar="True"
                    Skin="Office2007" Width="249%" OnNeedDataSource="gvBrowse_NeedDataSource" ShowGroupPanel="True">
                    <PagerStyle CssClass="es_grid_pager" Mode="NextPrevAndNumeric" />
                    <MasterTableView DataKeyNames="InvoiceNumber">
                        <RowIndicatorColumn Visible="False">
                            <HeaderStyle Width="20px" />
                        </RowIndicatorColumn>
                        <ExpandCollapseColumn Resizable="False" Visible="False">
                            <HeaderStyle Width="20px" />
                        </ExpandCollapseColumn>
                        <EditFormSettings>
                            <PopUpSettings ScrollBars="None" />
                        </EditFormSettings>
                        <Columns>
                            <telerik:GridEditCommandColumn UniqueName="EditCommandColumn" Visible="false" />
                        </Columns>
                    </MasterTableView>
                    <ClientSettings AllowColumnsReorder="True" AllowDragToGroup="True">
                        <ClientEvents OnRowContextMenu="RowContextMenu"></ClientEvents>
                        <Selecting AllowRowSelect="True" />
                    </ClientSettings>
                </telerik:RadGrid>

[Erjan Gavalji]

Hi Menna,

The correct syntax of the  RowContextMenu client-side event handler of RadGrid for ASP.NET Ajax is function rowContextMenu(sender, args). You should use the get_itemIndexHierarchical() client-side property to identify the item index. You can get a reference to the RadMenu client-side object by using the $find() global function.

Following your example:
function rowContextMenu(sender, args)
{
    var index = args.get_itemIndexHierarchical();

    document.getElementById("radGridClickedRowIndex").value = index;
    var menu = $find("<%= gvBrowseContextMenu.ClientID %>");
    alert(menu);
    alert(index.tostring());

    menu.show(args.get_domEvent());
...
}

Please, check the online examples, I believe they will help you get started with using RadControls for ASP.NET Ajax. You might also find the Online Documentation useful.

Kind regards,
Erjan Gavalji
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[Menna]

Hi Erjan
Thanks the context menu is working now, but iam having a hard time selecting the row that the user clicked right at.
this is what i reached so far:
function RowContextMenu( sender, args)
            {
                    var index = args.get_itemIndexHierarchical();

                    document.getElementById("radGridClickedRowIndex").value = index;
                    var menu = $find("<%= gvBrowseContextMenu.ClientID %>");
                   menu.show(args.get_domEvent());
                    var oGrid =$find("<%= gvBrowse.ClientID %>"); 
                    var oTable = oGrid.MasterTableView; 
                   
                    oTable.SelectRow(oTable.Rows[index].Control, false); 
}

[Veselin Vasilev]

Hello Menna,

Once you have the index of the row, you can select the row like this:

   var masterTable = sender.get_masterTableView();
   masterTable.clearSelectedItems();
   //select the current row
   masterTable.selectItem(masterTable.get_dataItems()[index].get_element());

Also, you might find these links useful:

• Code library - ContextMenu over a specified column in RadGrid
• Online example - AJAX-enabled context menu

I hope this helps.

Best wishes,
Veskoni
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center