Radgrid with contextmenu to enter edit mode of the selected item

[Carlos]

Hi Guys,

I'm having a bit of a problem with my javascript not occurring after the radgrid has one item in edit mode. I'm using editforms with a custom user control to display the data needed. I've got the exact same code on several other pages and there it works 100% fine. 

My radgrid displays all the items and whenever i want to edit a item I right click and it will display the Context Menu with options to either edit, remove or enable based on the status of a item.

ASPX:

<%@ Page Title="" Language="C#" MasterPageFile="~/SystemSettings.Master" AutoEventWireup="true" CodeBehind="mergefields.aspx.cs" Inherits="CT_Administer_Website.mergefields" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <script>
        function RowContextMenu(sender, eventArgs) {
            var menu = $find("<%=cmuMergeFieldsMenu.ClientID %>");
            var evt = eventArgs.get_domEvent();

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

            var index = eventArgs.get_itemIndexHierarchical();
            document.getElementById("<%= radGridClickedRowIndex.ClientID %>").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();
            }
        }



        function OnClientContextMenuShowing(sender, args) {
            var rowindex = document.getElementById("<%= radGridClickedRowIndex.ClientID %>").value;
            var DataItem = $find("<%= rgdMergeFields.ClientID %>").get_masterTableView().get_dataItems()[rowindex];
            var keyValues = DataItem.getDataKeyValue("_Active");

            document.getElementById("<%= radGridClickedRowValue.ClientID %>").value = DataItem.getDataKeyValue("_MergeFieldID");
            var nodeActiveState = keyValues;

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

            if (nodeActiveState == "False") {
                menu.findItemByValue("Remove").hide();
                menu.findItemByValue("Enable").show();
            } else {
                menu.findItemByValue("Enable").hide();
                menu.findItemByValue("Remove").show();
            }
        }

        function OnClientItemClicked(sender, args) {
            var itemValue = args.get_item().get_value();
            var menu = $find("<%= cmuMergeFieldsMenu.ClientID %>");

            if (itemValue == "Remove") {
                if (confirm("Are you sure you want to remove the selected Merge Field?") == true) {

                }
                else {
                    menu.hide();
                    eventArgs.set_cancel(true);
                }
            }
            else if (itemValue == "Enable") {
                if (confirm("Are you sure you want to enable the selected Merge Field?") == true) {

                }
                else {
                    menu.hide();
                    eventArgs.set_cancel(true);
                }
            }
        }
    </script>
    <div style="position: absolute; top: 1px; left: 0px; width: 100%;">
        <telerik:RadGrid ID="rgdMergeFields" runat="server" ViewStateMode="Disabled" AutoGenerateColumns="False"
            ClientSettings-Resizing-AllowColumnResize="false" AllowPaging="True" AllowSorting="True"
            PageSize="25" ResolvedRenderMode="Classic" OnItemDataBound="rgdMergeFields_ItemDataBound"
            OnPageIndexChanged="rgdMergeFields_PageIndexChanged" OnItemCommand="rgdMergeFields_ItemCommand"
            OnNeedDataSource="rgdMergeFields_NeedDataSource" OnUpdateCommand="rgdMergeFields_UpdateCommand">
            <MasterTableView DataKeyNames="_MergeFieldID" ClientDataKeyNames="_Active, _MergeFieldID"
                AllowCustomPaging="false" CommandItemDisplay="Top" InsertItemPageIndexAction="ShowItemOnCurrentPage">
                <CommandItemSettings AddNewRecordImageUrl="icon/plus.png" ShowRefreshButton="False" />
                <RowIndicatorColumn Visible="False">
                </RowIndicatorColumn>
                <ExpandCollapseColumn Created="True">
                </ExpandCollapseColumn>
                <Columns>
                    <telerik:GridTemplateColumn HeaderText="Status" UniqueName="_Status">
                        <HeaderStyle Width="8%" />
                        <ItemTemplate>
                            <asp:Image ID="imgStatus" runat="server" Height="16px" Width="16px" />
                        </ItemTemplate>
                    </telerik:GridTemplateColumn>
                    <telerik:GridBoundColumn DataField="_MergeFieldName" FilterControlAltText="Filter _MergeFieldName column"
                        HeaderText="Merge Field" SortExpression="_MergeFieldName" UniqueName="_MergeFieldName">
                        <HeaderStyle Width="60%" />
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="_LastUpdated" FilterControlAltText="Filter _LastUpdated column"
                        HeaderText="Last Updated" SortExpression="_LastUpdated" UniqueName="_LastUpdated">
                        <HeaderStyle Width="32%" />
                    </telerik:GridBoundColumn>
                </Columns>
                <EditFormSettings EditFormType="WebUserControl" FormStyle-BackColor="Black" UserControlName="editForms/MergeFieldsControl.ascx">
                </EditFormSettings>
            </MasterTableView>
            <ClientSettings>
                <ClientEvents OnRowContextMenu="RowContextMenu" />
                <Selecting AllowRowSelect="true" />
            </ClientSettings>
            <PagerStyle Mode="NextPrev" PageButtonCount="5" />
        </telerik:RadGrid>
        <input type="hidden" id="radGridClickedRowIndex" name="radGridClickedRowIndex" runat="server" />
        <input type="hidden" id="radGridClickedRowValue" name="radGridClickedRowValue" runat="server" />
        <telerik:RadContextMenu ID="cmuMergeFieldsMenu" runat="server" EnableRoundedCorners="true"
            EnableShadows="true" OnClientShowing="OnClientContextMenuShowing" OnClientItemClicked="OnClientItemClicked"
            OnItemClick="cmuMergeFieldsMenu_ItemClick">
            <Items>
                <telerik:RadMenuItem Text="Edit" Value="Edit">
                </telerik:RadMenuItem>
                <telerik:RadMenuItem Text="Remove" Value="Remove">
                </telerik:RadMenuItem>
                <telerik:RadMenuItem Text="Enable" Value="Enable">
                </telerik:RadMenuItem>
            </Items>
        </telerik:RadContextMenu>
    </div>
    <telerik:RadNotification ID="rdnNotification" runat="server" Position="Center" Title="Please Note!"
        AutoCloseDelay="0" ResolvedRenderMode="Classic">
    </telerik:RadNotification>
</asp:Content>


Code Behind:

using System;
using System.Linq;
using System.Web.UI.WebControls;
using Telerik.Web.UI;

namespace CT_Administer_Website
{
    public partial class mergefields : System.Web.UI.Page
    {
        Administer_WCFService.MergeFieldsClient wcf = new Administer_WCFService.MergeFieldsClient();

        protected void Page_Load(object sender, EventArgs e)
        {
            if (Request.Cookies["LoginUser"] != null)
            {
                permissions.permissions p = (permissions.permissions)Session["Permissions"];
                rgdMergeFields.DataSource = wcf.DisplayMergeFields(p.ViewInactives);
                rgdMergeFields.DataBind();
            }
            else
            {
                Response.Redirect("login.aspx");
            }
        }

        protected void rgdMergeFields_ItemCommand(object sender, Telerik.Web.UI.GridCommandEventArgs e)
        {
            if (e.CommandName.Equals(RadGrid.InitInsertCommandName))
            {
                e.Item.Edit = true;
                e.Item.OwnerTableView.Rebind();
            }
        }

        protected void rgdMergeFields_ItemDataBound(object sender, Telerik.Web.UI.GridItemEventArgs e)
        {
            try
            {
                //Add an icon to the Grid items to show as a status
                if (e.Item is GridDataItem)
                {
                    Administer_WCFService.ct_MergeFields dataSourceRow = (Administer_WCFService.ct_MergeFields)e.Item.DataItem;
                    GridDataItem dataItem = (GridDataItem)e.Item;

                    Image newImage = dataItem.FindControl("imgStatus") as Image;
                    //tick.png for Enabled & cross.png for Disabled
                    newImage.ImageUrl = dataSourceRow._Active.Equals(true) ? "icon/tick.png" : "icon/cross.png";
                }
            }
            catch
            {
                rdnNotification.Title = Resources.MyGlobalResource.NotificationTitle_FatalError;
                rdnNotification.Show(Resources.MyGlobalResource.NotificationMessage_FatalError);
            }
        }

        protected void rgdMergeFields_NeedDataSource(object sender, Telerik.Web.UI.GridNeedDataSourceEventArgs e)
        {
            permissions.permissions p = (permissions.permissions)Session["Permissions"];
            rgdMergeFields.DataSource = wcf.DisplayMergeFields(p.ViewInactives);
        }

        protected void rgdMergeFields_PageIndexChanged(object sender, Telerik.Web.UI.GridPageChangedEventArgs e)
        {
            try
            {
                rgdMergeFields.CurrentPageIndex = e.NewPageIndex;
            }
            catch
            {
                rdnNotification.Title = Resources.MyGlobalResource.NotificationTitle_FatalError;
                rdnNotification.Show(Resources.MyGlobalResource.NotificationMessage_FatalError);
            }
        }

        protected void rgdMergeFields_UpdateCommand(object sender, Telerik.Web.UI.GridCommandEventArgs e)
        {
            permissions.permissions p = (permissions.permissions)Session["Permissions"];
            rgdMergeFields.DataSource = wcf.DisplayMergeFields(p.ViewInactives);
            rgdMergeFields.DataBind();
        }

        protected void cmuMergeFieldsMenu_ItemClick(object sender, Telerik.Web.UI.RadMenuEventArgs e)
        {
            try
            {
                //Context Menu Items
                if (e.Item.Value.Equals("Edit"))
                {
                    rgdMergeFields.Items[Convert.ToInt32(radGridClickedRowIndex.Value)].Edit = true;
                    rgdMergeFields.Items[Convert.ToInt32(radGridClickedRowIndex.Value)].OwnerTableView.Rebind();
                }
                else if (e.Item.Value.Equals("Enable"))
                {
                    //Enable a Disabled Report Profile
                    wcf.ChangeMergeFieldStatus(Convert.ToInt32(radGridClickedRowValue.Value), true, Request.Cookies["LoginUser"].Values["UserName"], Convert.ToInt32(Request.Cookies["LoginUser"].Values["UserID"]));
                    permissions.permissions p = (permissions.permissions)Session["Permissions"];
                    rgdMergeFields.DataSource = wcf.DisplayMergeFields(p.ViewInactives);
                    rgdMergeFields.DataBind();
                }
                else if (e.Item.Value.Equals("Remove"))
                {
                    //Disable an Enabled Report Profile
                    int result = wcf.ChangeMergeFieldStatus(Convert.ToInt32(radGridClickedRowValue.Value), false, Request.Cookies["LoginUser"].Values["UserName"], Convert.ToInt32(Request.Cookies["LoginUser"].Values["UserID"]));
                    permissions.permissions p = (permissions.permissions)Session["Permissions"];
                    rgdMergeFields.DataSource = wcf.DisplayMergeFields(p.ViewInactives);
                    rgdMergeFields.DataBind();

                    if (result.Equals(2))
                    {
                        rdnNotification.Show("Disabled");
                    }
                    else
                    {
                        rdnNotification.Show("Removed");
                    }
                }
            }
            catch
            {
                rdnNotification.Title = Resources.MyGlobalResource.NotificationTitle_FatalError;
                rdnNotification.Show(Resources.MyGlobalResource.NotificationMessage_FatalError);
            }
        }
    }
}

Thanks in advance

[Eyup]

Hi Carlos,

I believe you are using the following sample as a base:
http://demos.telerik.com/aspnet-ajax/grid/examples/columns-rows/columns/context-menu/defaultcs.aspx#

Please temporarily disable any ajaxification on the page and enable your script debugger(FireBug or F12) to see whether there are any script errors interfering.

Hope this helps.

Regards,
Eyup
Telerik

 

 

[Carlos]

Hi 

I resolved the issue last week. Was calling two javascript functions in the context menu. These javascript functions didn't exist though

Thanks for the reply