Unable to get value of the property 'parentNode': object is null or undefined

[Leo]

Hi.
I'm getting this error using a RadToolTipManager, related to a control (RadioButton) inside a gridView.

When I click on RadioButton, I want the tooltip to appear. The tooltip refers to a UserControl.

I attach the code, if needed.

Thanks in advance.

Leo

RadToolTip.aspx

<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true"
    CodeBehind="radtooltip.aspx.cs" Inherits="WebApplication1.radtooltip" %>

<%@ Register Assembly="Telerik.Web.UI, Version=2010.2.713.40, Culture=neutral, PublicKeyToken=121fae78165ba3d4"
    Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <asp:ScriptManager ID="MasterScriptManager" runat="server" AsyncPostBackTimeout="300"
        ScriptMode="Release">
        </asp:ScriptManager>
        <telerik:RadToolTipManager runat="server" ID="RadToolTipManager1" Position="Center"
            RelativeTo="Element" Width="400px" Height="200px" Animation="Resize" Skin="Default"
            OnAjaxUpdate="OnAjaxUpdate" ShowEvent="OnClick" EnableShadow="true" RenderInPageRoot="true"
            ShowDelay="0">
        </telerik:RadToolTipManager>
        <asp:GridView ID="AttivitaGv" runat="server" AllowPaging="True" AllowSorting="True"
            AutoGenerateColumns="False" OnRowDataBound="AttivitaGV_RowDataBound" Width="950px"
            ViewStateMode="Enabled" CellPadding="3">
            <columns>
            <asp:TemplateField
                ItemStyle-HorizontalAlign="Center" HeaderStyle-Width="60px">
                <ItemTemplate>
                    <asp:RadioButton ID="rbPianificata" runat="server" GroupName="StatoAttivita" />
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField
                ItemStyle-HorizontalAlign="Center" HeaderStyle-Width="60px">
                <ItemTemplate>
                    <asp:RadioButton ID="rbEffettuata" runat="server" GroupName="StatoAttivita" />
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField
                ItemStyle-HorizontalAlign="Center" HeaderStyle-Width="60px">
                <ItemTemplate>
                    <asp:RadioButton ID="rbAnnullata" runat="server" GroupName="StatoAttivita" />
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField
                ItemStyle-HorizontalAlign="Center" HeaderStyle-Width="60px">
                <ItemTemplate>
                    <asp:RadioButton ID="rbRipianificata" runat="server" GroupName="StatoAttivita" />
                </ItemTemplate>
            </asp:TemplateField>
        </columns>
            <pagersettings mode="NumericFirstLast" />
            <alternatingrowstyle cssclass="GridAlternating" />
            <editrowstyle cssclass="GridEdit" />
            <footerstyle cssclass="GridFooter" />
            <headerstyle cssclass="GridHeader" />
            <pagerstyle cssclass="GridPager" />
            <rowstyle cssclass="GridRow" />
            <selectedrowstyle cssclass="GridSelectedRow" />
            <sortedascendingcellstyle cssclass="GridSortedCells" />
            <sortedascendingheaderstyle cssclass="GridSortedHeader" />
            <sorteddescendingcellstyle cssclass="GridSortedCells" />
            <sorteddescendingheaderstyle cssclass="GridSortedHeader" />
        </asp:GridView>
</asp:Content>

RadToolTip.aspx.cs

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

namespace WebApplication1
{
    public partial class radtooltip : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            List<Item> items = new List<Item>();
            items.Add(new Item() { IdCliente = 1, Email = "Mark" });
            items.Add(new Item() { IdCliente = 2, Email = "Jon" });
            items.Add(new Item() { IdCliente = 3, Email = "Frank" });
            items.Add(new Item() { IdCliente = 4, Email = "Mark" });

            AttivitaGv.DataSource = items;
            AttivitaGv.DataBind();
        }

        protected void AttivitaGV_RowDataBound(object sender, GridViewRowEventArgs e)
        {
            try
            {
                if (e.Row.RowType == DataControlRowType.DataRow)
                {
                    this.RadToolTipManager1.TargetControls.Add(((RadioButton)e.Row.FindControl("rbPianificata")).ClientID,
                            "123", true);
                }
            }
            catch (Exception ex)
            {
                throw new Exception(ex.Message, ex);
            }
        }

        protected void OnAjaxUpdate(object sender, ToolTipUpdateEventArgs args)
        {
            this.UpdateToolTip(args.Value, args.UpdatePanel);
        }

        private void UpdateToolTip(string elementID, UpdatePanel panel)
        {
            Control ctrl = Page.LoadControl("AttivitaShort.ascx");
            panel.ContentTemplateContainer.Controls.Add(ctrl);
            AttivitaShort details = (AttivitaShort)ctrl;
            details.ConfigureView(int.Parse(elementID));
        }

        public class Item
        {
            private int id;

            public int IdCliente
            {
                get { return id; }
                set { id = value; }
            }
            private string name;

            public string Email
            {
                get { return name; }
                set { name = value; }
            }
        }
    }
}

AttivitaShort.ascx

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="AttivitaShort.ascx.cs" Inherits="WebApplication1.AttivitaShort" %>
<asp:Label ID="lbl1" runat="server"></asp:Label>

AttivitaShort.ascx.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace WebApplication1
{
    public partial class AttivitaShort : System.Web.UI.UserControl
    {

        protected void Page_Load(object sender, EventArgs e)
        {
        }

        public void ConfigureView(int IdCliente)
        {
            lbl1.Text = IdCliente.ToString();
        }
    }
}

[Marin Bratanov]

Hi Leo,

  I cannot see an error in your code and it ran as expected on my end (you can find my test page attached and a video from my experiment here) even with the old version I notice in the Imports directive. Please make sure that you are using this same code when you experience this issue, as such an error usually occurs when you try to access the tooltip before it is fully initialized (which happens only after it has to be shown). This means that handlers to the OnClientBeforeShow event are likely to cause such an error. You may also try adding some timeout (for example start at 500 or 800 ms and decrease if it fixes the issue) to the offending piece of code to see if the lazy initialization results in this behavior.

You can also compare your code with my page and see if there are any differences.

On a side note - I would advise setting the HideEvent to the desired value and not using the OnClick for the ShowEvent, since it would override the default behavior of the radiobutton (it handles its clicks by default).

If you continue to experience difficulties I advise that you open a support ticket and attach a fully runnable project that isolates your case so we can reproduce and debug it locally in order to provide a more to the point answer.


Greetings,
Marin
the Telerik team

[Leo]

I'm facing again the problem, also with your code.

I was using IE9 in IE8 Browser Mode, but I see that in IE9 mode it gets error too... 

another screen, hope it helps.

thanks.

[Marin Bratanov]

Hi Leo,

I answered your support thread on the matter and I will repeat my advice here for your convenience and for other who might come across such an issue:

This error occurs with an old version of the controls and my advice it upgrade to the latest, as many improvements and features have been added, as well as the general behavior has been made more consistent. That being said - I was unable to replicate this error with the latest version (Q2 2011) or without a master page.

Kind regards,
Marin
the Telerik team

[Leo]

Hi Marin,

how can I achieve this goal? "... not using the OnClick for the ShowEvent, since it would override the default behavior of the radiobutton (it handles its clicks by default)."

I see that if I click on the radio button, the tooltip appears, but the radio button isn't checked.

Thanks for your help.

Leo

[Marin Bratanov]

Hi Leo,

  This was exactly my point - if the ShowEvent is OnClick you wouldn't be able to toggle the radio button or checkbox. That is why I would recommend using the OnMouseOver or OnRightClick events. You could also try setting them to FromCode and manage manually when to show and hide the tooltips via some custom JavaScript functions that handle the click event which you attach to the desired elements, but this approach is more difficult to implement and is very likely to result in the same behavior as the OnClick event.

Best wishes,
Marin
the Telerik team