tool tip not showing in content page

3 posts, 0 answers
  1. Chom
    Chom avatar
    56 posts
    Member since:
    Dec 2009

    Posted 13 Jan 2012 Link to this post

    Hello all,

    I am using some code from an online demo which shows the asp.net validation summary in the ajax tool tip control. The code runs fine in a plain .aspx page. However when I put the code in a content page which is using a master page the tool tip does not show when the text boxes are not completed and the rad button is clicked. I get a show() object is null or undefiend.

    I have tried the javascript in both the master page and the content page, but I still get the same error.
    What am I missing here?
    <asp:Content ID="Content8" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
            <script type="text/javascript">
                 //<![CDATA[
            function HideTooltip() {
                var tooltip = Telerik.Web.UI.RadToolTip.getCurrent();
                if (tooltip) tooltip.hide();
            }
     
            function ShowTooltip() {
                window.setTimeout(function () {
                    var tooltip = $find("RadToolTip1");
                    //API: show the tooltip
                    tooltip.show();
                }, 10);
            }
     
            function CheckIfShow(sender, args) {
                var summaryElem = document.getElementById("ValidationSummary1");
     
                //check if summary is visible
                if (summaryElem.style.display == "none") {
                    //API: if there are no errors, do not show the tooltip
                    args.set_cancel(true);
                }
            }
          //]]>
        </script>
       <div style="margin-left: auto; margin-right: auto; width: 400px">
        <table>
            <tr>
                <td>
                    First name:
                </td>
                <td>
                    <telerik:RadTextBox ID="rtxtFirstName" runat="server">
                    </telerik:RadTextBox>
                </td>
                <td>
                    <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="First name required." ControlToValidate="rtxtFirstName">*</asp:RequiredFieldValidator>
                </td>
            </tr>
            <tr>
                <td>
                    Last name:
                </td>
                <td>
                    <telerik:RadTextBox ID="rtxtLastName" runat="server">
                    </telerik:RadTextBox>
                </td>
                <td>
                    <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ErrorMessage="Last name required." ControlToValidate="rtxtLastName">*</asp:RequiredFieldValidator>
                </td>
            </tr>
            <tr>
                <td></td>
                <td>
                    <telerik:RadToolTip ID="RadToolTip1" runat="server" HideEvent="ManualClose" ShowEvent="FromCode" RelativeTo="Element" EnableShadow="true" TargetControlID="rbtnGetName" OnClientBeforeShow="CheckIfShow" ManualClose="true" Position="MiddleRight" Skin="Web20">
                        <asp:ValidationSummary ID="ValidationSummary1" runat="server" ForeColor="Red" />
                    </telerik:RadToolTip>
                </td>
                <td></td>
            </tr>
            <tr>
                <td></td>
                <td>
                    <telerik:RadButton ID="rbtnGetName" runat="server" Text="Get Name" OnClientClicking="ShowTooltip">
                    </telerik:RadButton>
                </td>
                <td></td>
            </tr>
        </table>
       </div>
    </asp:Content>

  2. Kevin
    Kevin avatar
    360 posts
    Member since:
    Jul 2012

    Posted 13 Jan 2012 Link to this post

    Hello Chom,

    As your RadToltip is contained inside the master pages ContentPlaceHolder, the actual id on the client would be something like "ct100_RadToolTip1", thus the reason it throws an error. To correctly get the RadTolotip's id, you need use the ClientID of the control. Like so:

    var tooltip = $find("<%=RadToolTip1.ClientID%>");

    I hope that helps.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Chom
    Chom avatar
    56 posts
    Member since:
    Dec 2009

    Posted 15 Jan 2012 Link to this post

    HI Kevin,

    That did the trick.

    Thanks
    Regards,
    Chom
Back to Top