JavaScript and RadGrid and Master Page Confusion

[TPerry]

Hi - I have a Grid with a context menu that appears when you right click on a line.  This project was originally written using Telerik ASPNET Controls, I recently upgraded it to ASPNET AJAX and since I upgraded the context menu isn't working.  When I right click I get the following JS error:  "'null' is null or not an object".  It's not finding the menu.  What could have changed wihen I upgraded Telerik?  Thanks in advance for your help - I'm pulling my hair out. 

Here is the Javascript I am using:

function 

 

RowContextMenu(sender, eventArgs)

 

 

 {

 

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

 

 

 

menu.show(eventArgs.get_domEvent());

 

 

 

document.getElementById("radGridClickedRowIndex").value = eventArgs.get_itemIndexHierarchical();

 

 

 

var ownerTable = eventArgs.get_tableView();

 

 

 

document.getElementById("radGridClickedTableId").value = ownerTable._data.UniqueID;

 

 

 

}

 

 

 

 

 

[Steve Y]

Here's what I use (which is a direct copy of a Telerik provided function)

function RowContextMenu(sender, eventArgs)
    [
        var menu = $find("<%=RadMenu1.ClientID %>");
        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();
        ]
    ]

And then this is the hidden field to stow the row index, plus the context menu declaration.

<input type="hidden" id="radGridClickedRowIndex" name="radGridClickedRowIndex" />

<telerik:RadContextMenu ID="RadMenu1" runat="server" Skin="Outlook" OnItemClick="RadMenu1_ItemClick">
    <Items>
        <telerik:RadMenuItem Text="Add" ImageUrl="^/Images/Buttons/add.png" />
        <telerik:RadMenuItem Text="Edit" ImageUrl="^/Images/Buttons/Edit.gif" />
        <telerik:RadMenuItem Text="Delete" ImageUrl="^/Images/Buttons/delete.png" />
        <telerik:RadMenuItem Text="Refresh" ImageUrl="^/Images/Buttons/refresh.png" />
        <telerik:RadMenuItem Text="Print" ImageUrl="^/Images/Buttons/envelope.png" />
    </Items>
</telerik:RadContextMenu>

and finally the code behind for the menu item click

protected void RadMenu1_ItemClick(object sender, RadMenuEventArgs e)
    [
        int radGridClickedRowIndex;

        radGridClickedRowIndex = Convert.ToInt32(Request.Form["radGridClickedRowIndex"]);

        switch (e.Item.Text)
        [
            case "Edit":
                RadGridLetters.Items[radGridClickedRowIndex].Edit = true;
                RadGridLetters.Rebind();
                break;
            case "Add":
                RadGridLetters.MasterTableView.IsItemInserted = true;
                RadGridLetters.Rebind();
                break;
            case "Delete":
                RadGridLetters.MasterTableView.PerformDelete(RadGridLetters.Items[radGridClickedRowIndex]);
                break;
            case "Refresh":
                RadGridLetters.Rebind();
                break;
            case "Print":
                break;

        ]
    ]

Hope this helps, Steve

[TPerry]

Thanks Steve, but that didn't work.  :(  I created a new page, with no master page, and copied all of your code into it.  I had to change the [ to { and also var menu = $find("<%=RadMenu1.ClientID %>");  to var menu = $find("<%#RadMenu1.ClientID %>"); because I got the following error:  The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>).  I'm still getting the same JS error when I right click:  "'null' is null or not an object"

[Steve Y]

Hi,

My code is also used in a masterpage environment. In fact it's in a usercontrol called from an aspx page which has a masterpage...

To get rid of the The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>), you should encapsulate the javascript inside a RadCodeBlock like this.

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
<script language="javascript" type="text/javascript">
    function RowContextMenu(sender, eventArgs)
    [
       ......
    ]
</script>
</telerik:RadCodeBlock>

The [ and ] are not mine. I think the code block display feature of the forum changed them from [ and ] somehow...

Once you have the radcodeblock stuff added, change the find back to:

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

and give it all a whirl !!

Regards, Steve

[TPerry]

Thank you so much Steve!  I can't believe I just spent two days on this, all because I needed to put the JS in a code block.  Unbelievable.