This is a migrated thread and some comments may be shown as answers.

ToolTip error: Object doesn't support this property or method

3 Answers 79 Views
ToolTip
This is a migrated thread and some comments may be shown as answers.
Phil
Top achievements
Rank 2
Phil asked on 15 Dec 2010, 05:09 PM
Hi:

I have a simple example (I used code infront for ease of showing this example and pasting the code).
<%@ Page Language="VB" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
    Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click
        RadScriptManager.RegisterStartupScript(Me, Me.GetType, "openShowRadToolTip1", "ShowMyRadToolTip1();", True)
    End Sub
</script>
<head runat="server"><title>Tool tip js test</title></head>
<body>
    <form id="form1" runat="server">
        <telerik:RadScriptManager ID="RadScriptManager1" Runat="server">
        </telerik:RadScriptManager>
        <asp:Button ID="Button1" runat="server" Text="Button" />
        <telerik:RadToolTip ID="RadToolTip1" runat="server" IsClientID="true" >
            I am here!
        </telerik:RadToolTip>
        <script type="text/javascript">
            //<![CDATA[
            function ShowMyRadToolTip1() {
                var radName = '<%= RadToolTip1.ClientID %>';
                var rad_ToolTip = $find(radName);
                if (rad_ToolTip == null) {
                    alert("get element by id of:" + radName);
                    rad_ToolTip = document.getElementById(radName);
                }
                rad_ToolTip.show();
            };
            //]]>
        </script>
    </form>
</body>
</html>
I have a tool-tip that I am trying to to show via javascript, but I am getting the following error:
 Microsoft JScript runtime error: Object doesn't support this property or method
I believe that getElementById ultimately finds the div tag (not the $find), but the show method is not understood.
Phil

3 Answers, 1 is accepted

Sort by
0
Accepted
Svetlina Anati
Telerik team
answered on 15 Dec 2010, 05:38 PM
Hi Phil,

 The controls in the RadControls for ASP.NET AJAX suite are built upon the MS AJAX framework and the framework itself creates its controls (including RadToolTip) in the Sys.Application.add_init() method.

Here is how the client events are fired in the page life cycle:

window.onload -> Sys.Application.init -> Sys.Application.load

You can see that the client object representation of MS AJAX controls are created just as the last code on the page in the Sys.Application.init event, which is raised after the window.onload event.

That is why when you call your code in window.onload by registering the client script, the RadToolTip will still not be created on the page and you will get an error. To avoid this problem, you can either execute your code with a small timeout, or use the Sys.Application.add_load method.

You can find additional information about this here:

http://blogs.telerik.com/blogs/posts/09-05-05/executing_javascript_function_from_server-side_code.aspx

This being said, you should modify your code e.g in the following manner:

<%@ Page Language="VB" %>
  
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
    Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click
        RadScriptManager.RegisterStartupScript(Me, Me.GetType, "openShowRadToolTip1", "Sys.Application.add_load(ShowMyRadToolTip1);", True)
    End Sub
</script>
<head id="Head1" runat="server">
    <title>Tool tip js test</title>
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
    </telerik:RadScriptManager>
    <asp:Button ID="Button1" runat="server" Text="Button" />
    <telerik:RadToolTip ID="RadToolTip1" runat="server" IsClientID="true">
        I am here!
    </telerik:RadToolTip>
    <script type="text/javascript">
            //<![CDATA[
        function ShowMyRadToolTip1()
        {
            Sys.Application.remove_load(ShowMyRadToolTip1);
            var radName = '<%= RadToolTip1.ClientID %>';
            var rad_ToolTip = $find(radName);
            if (rad_ToolTip == null)
            {
                alert("get element by id of:" + radName);
                rad_ToolTip = document.getElementById(radName);
            }
            rad_ToolTip.show();
        };
            //]]>
    </script>
    </form>
</body>
</html>

I hope that the provided explanation and resource are helpful, let me know how it goes.

Best wishes,
Svetlina
the Telerik team
Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
0
Phil
Top achievements
Rank 2
answered on 16 Dec 2010, 03:52 AM
Hey:
Wow ... excellent explanation.
Phil
0
Svetlina Anati
Telerik team
answered on 16 Dec 2010, 04:40 PM
Hi Phil,

 I am glad I could help! In case you experience other problems related to RadToolTip do not hesitate to contact me again.

Best wishes,
Svetlina
the Telerik team
Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
Tags
ToolTip
Asked by
Phil
Top achievements
Rank 2
Answers by
Svetlina Anati
Telerik team
Phil
Top achievements
Rank 2
Share this question
or