RadContext Menu issue in RadGrid

[Sunil]

Hi all,

I have a context menu in a grid. The context menu works as it should but when I right click on areas in the grid that are not rows or columns then I get a code error because there is no row selected. If you look at the attached image you can see what I mean.

Code is below. I've set the context menu target to the grid.

Thanks for any help!

         <asp:SqlDataSource ID="SqlDataSource_PT20" runat="server">
         </asp:SqlDataSource>
     </asp:PlaceHolder>
<asp:PlaceHolder ID="PlaceHolder2" runat="server">
<input type="hidden" id="RadGridClickedRowIndex" name="RadGridClickedRowIndex" value="1" />
 <telerik:RadGrid ID="RadGrid_PT20" runat="server" AutoGenerateColumns="false"
 AllowMultiRowSelection="false" AllowPaging="True" AllowCustomPaging="True" PageSize="15" AllowAutomaticInserts="false"
 GridLines="None" CellPadding="0" AllowSorting="false" Skin="Default" OnItemDataBound="Att_Log_Translate"
 ItemStyle-VerticalAlign="Top" OnNeedDataSource="RadGrid_PT20_NeedDataSource">
     <ExportSettings IgnorePaging="false" OpenInNewWindow="true">
         <Pdf PageHeight="297mm" PageWidth="210mm" PageTitle="OnTime System Logs" />
     </ExportSettings>
     <PagerStyle Mode="NextPrevAndNumeric"/>
     <MasterTableView Width="100%" CommandItemDisplay="Top" GridLines="None" AllowAutomaticInserts="false">
     <CommandItemSettings ShowAddNewRecordButton="false" />
     <CommandItemTemplate>
         <telerik:RadToolBar ID="RadToolBar_PT20" runat="server" Skin="Default"
         OnButtonClick="RadToolBar_PT20_CommandClick">
             <Items>
                 <telerik:RadToolBarDropDown Text="Export" ImageUrl="Images/pdf_icon.gif">
                     <Buttons>
                         <telerik:RadToolBarButton Text="Export Current View"  Group="Bold"
                         CheckOnClick="true" AllowSelfUnCheck="true"
                          CommandName="ExportToPDF" ImageUrl="Images/pdf_icon.gif"/>
                         <telerik:RadToolBarButton Text="Export All Records" Group="Italic"
                         CheckOnClick="true" AllowSelfUnCheck="true" />
                     </Buttons>
                 </telerik:RadToolBarDropDown>
             </Items>
         </telerik:RadToolBar>
     </CommandItemTemplate>
         <Columns>

              <telerik:GridBoundColumn UniqueName="Log_ID" DataField="Attendance_Logs_Auto_ID" HeaderText="Log ID"
              Visible="false"/>
              <telerik:GridBoundColumn UniqueName="Employee_First_Name" DataField="Employee_First_Name" HeaderText="First Name"
              Visible="false"/>
             <telerik:GridTemplateColumn UniqueName="PT20_Left_Column" HeaderText="Type" HeaderStyle-Width="40%">
                 <ItemTemplate>

                     <asp:Panel ID="Panel3" runat="server" CssClass="logs_table_text">
                         <asp:Literal ID="Literal_Att_Logs_DateTime" runat="server"
                         Text='<%# Eval("Attendance_Logs_DateTime").ToString() %>'></asp:Literal>
                         <br />
                         <asp:Literal ID="Literal2" runat="server" meta:resourcekey="Literal2Resource1"
                          Text="T: "></asp:Literal>
                         <asp:Literal ID="Literal_Att_Logs_Terminal_Name" runat="server"
                         Text='<%# Eval("Terminal_Name").ToString() %>'></asp:Literal>
                     </asp:Panel>
                 </ItemTemplate>
             </telerik:GridTemplateColumn>

             <telerik:GridTemplateColumn UniqueName="PT20_Right_Column" HeaderText="Description" HeaderStyle-Width="60%">
                 <ItemTemplate>
                 <asp:Panel ID="Panel4" runat="server" CssClass="logs_table_text" >
                     <asp:Literal ID="Literal_Att_Logs_Employee_Name" runat="server"
                     Text='<%# Eval("Employee_First_Name").ToString() %>'></asp:Literal>
                         <asp:Literal ID="Literal_Att_Logs_Employee_Name1" runat="server"
                         Text='<%# Eval("Employee_Last_Name").ToString() %>'></asp:Literal>
                         <br />
                         <asp:Literal ID="Literal1" runat="server" meta:resourcekey="Literal1Resource1" Text="-">
                         </asp:Literal>
                         <asp:Literal ID="Literal_Att_Logs_Type" runat="server"
                          Text='<%# Eval("Attendance_Logs_Type").ToString() %>'>
                          </asp:Literal>
                 </asp:Panel>
                 </ItemTemplate>
             </telerik:GridTemplateColumn>
         </Columns>
     </MasterTableView>
     <ClientSettings>
         <Selecting AllowRowSelect="true" />
         <ClientEvents OnRowContextMenu="PT20_ContextMenu"></ClientEvents>
     </ClientSettings>
 </telerik:RadGrid>
 <telerik:RadContextMenu ID="RadMenu_PT20" runat="server" OnItemClick="RadMenu_PT20_ItemClick"
 Skin="Default" >
       <Items>
            <telerik:RadMenuItem Text="Go to Employee" />
            <telerik:RadMenuItem Text="Go to Terminal" />
            <telerik:RadMenuItem Text="Edit Record" />
       </Items>
       <Targets>
            <telerik:ContextMenuControlTarget ControlID="RadGrid_PT20"/>
       </Targets>
 </telerik:RadContextMenu>

[Sunil]

Just to clarify, although you can see a row selected in that picture, its just the previous row that I manually selected.

I right clicked on the toolbar and the context menu appears.
I right click on the column names in the grid and the menu appears.

I just want the menu to appear for the rows/columns in the rad grid.

Thanks

[Sunil]

I fixed this by getting rid of the target tag in the context menu....

I still have one question though. How does the context menu know to bind itself to the grid???

Sunny

[Yana]

Hi Sunil,

The grid is subscribed to the client-side OnRowContextMenu event, can you paste the code of its handler? Thanks

Greetings,
Yana
the Telerik team

[Sunil]

Hi,

Code is pasted below. As you will note, I've had to manually type in the name of the RadMenu control. The reason I have done this is because the RadMenu and RadGrid (code posted in first post on thread) controls are in a Web User Control. This WUC is then loaded in a default.aspx page.

You could make the RadMenu a public property with get/set methods but I just typed the name on the control instead.

function PT20_ContextMenu(sender, eventArgs) {
    var menu = $find("WUC_previous_20_transactions_wuc_RadMenu_PT20");
    var evt = eventArgs.get_domEvent();

    if (evt.target.tagName == "INPUT" || evt.target.tagName == "A") {
        return;
    }

    var index = eventArgs.get_itemIndexHierarchical();
    document.getElementById("RadGridClickedRowIndex").value = index;

    sender.get_masterTableView().selectItem(sender.get_masterTableView().get_dataItems()[index].get_element(), true);

    menu.show(evt);

    evt.cancelBubble = true;
    evt.returnValue = false;

    if (evt.stopPropagation) {
        evt.stopPropagation();
        evt.preventDefault();
    }
}

[Yana]

Hello Sunny,

Actually you open the context menu manually using its show() method. Also you can access the client-side object of the menu like this:

var menu = $find("<%=RadMenu_PT20.ClientID %>");

All the best,
Yana
the Telerik team