Cancel RadToolTipManager at AjaxUpdate

7 posts, 0 answers
  1. Brandon
    Brandon avatar
    6 posts
    Member since:
    Apr 2013

    Posted 11 Apr 2013 Link to this post

    I have a RadToolTipManager set to AutoToolTipify my page, however, there are many controls on the page with a Title attribute set that I do not want tooltipped. Is there a way to cancel the tooltip creation based on the TargetControlID?

    My thinking would be I could do something along these lines:

    If e.TargetControlID.Contains("HyperLink1") Then
        'Do actions for tooltip
    Else
        e.cancel()
    End If

    Is there any way to do what I'm hoping to do, or a good way to specify what to Tooltipify based on what the Title attribute is set to?

    -Thanks
  2. Brandon
    Brandon avatar
    6 posts
    Member since:
    Apr 2013

    Posted 12 Apr 2013 Link to this post

    Update with code. At this point, EVERYTHING is tooltipped. 

    RadToolTipManager:
    <telerik:RadToolTipManager ID="RadToolTipManager1" runat="server" Skin="Telerik" Animation="Slide" AnimationDuration="250" Overlay="True" AutoCloseDelay="0" OffsetX="195" AutoTooltipify="True" RelativeTo="Element" Sticky="True" HideEvent="LeaveTargetAndToolTip" Text="Loading..." ShowDelay="400"></telerik:RadToolTipManager>

    RadGrid (Trying to tooltip the HyperLink in the first column:
    <telerik:RadGrid ID="gridQueue" runat="server" CellSpacing="0" DataSourceID="QueueDS" GridLines="None" Skin="Telerik" AllowPaging="True">
                                            <MasterTableView AutoGenerateColumns="False" DataKeyNames="TagID" DataSourceID="QueueDS" PageSize="20">
                                                <CommandItemSettings ExportToPdfText="Export to PDF" />
                                                <RowIndicatorColumn FilterControlAltText="Filter RowIndicator column">
                                                    <HeaderStyle Width="20px" />
                                                </RowIndicatorColumn>
                                                <ExpandCollapseColumn FilterControlAltText="Filter ExpandColumn column" Visible="True" Created="True">
                                                    <HeaderStyle Width="20px" />
                                                </ExpandCollapseColumn>
                                                <Columns>
                                                    <telerik:GridTemplateColumn DataField="TagID" DataType="System.Int32" FilterControlAltText="Filter TagID column" HeaderText="TagID" SortExpression="TagID" UniqueName="TagID">
                                                        <EditItemTemplate>
                                                            <asp:TextBox ID="TagIDTextBox" runat="server" Text='<%# Bind("TagID") %>'></asp:TextBox>
                                                        </EditItemTemplate>
                                                        <ItemTemplate>
                                                            <asp:HyperLink ID="HyperLink1" runat="server" title="tag" NavigateUrl='<%# "~/Queue/QueueSummary.aspx?tagID=" & Eval("TagID") %>' Text='<%# Eval("TagID") %>'></asp:HyperLink>
                                                        </ItemTemplate>
                                                    </telerik:GridTemplateColumn>
                                                    <telerik:GridBoundColumn DataField="TagStatus" FilterControlAltText="Filter TagStatus column" HeaderText="Status" UniqueName="TagStatus">
                                                        <ColumnValidationSettings>
                                                            <ModelErrorMessage Text="" />
                                                        </ColumnValidationSettings>
                                                    </telerik:GridBoundColumn>
                                                    <telerik:GridBoundColumn DataField="TagType" FilterControlAltText="Filter TagType column" HeaderText="Tag Type" SortExpression="TagType" UniqueName="TagType">
                                                        <ColumnValidationSettings>
                                                            <ModelErrorMessage Text="" />
                                                        </ColumnValidationSettings>
                                                    </telerik:GridBoundColumn>
                                                    <telerik:GridBoundColumn DataField="CreatedDTS" DataType="System.DateTime" FilterControlAltText="Filter CreatedDTS column" HeaderText="Created DTS" SortExpression="CreatedDTS" UniqueName="CreatedDTS">
                                                        <ColumnValidationSettings>
                                                            <ModelErrorMessage Text="" />
                                                        </ColumnValidationSettings>
                                                    </telerik:GridBoundColumn>
                                                    <telerik:GridBoundColumn DataField="ITEMNMBR" FilterControlAltText="Filter ITEMNMBR column" HeaderText="Item" SortExpression="ITEMNMBR" UniqueName="ITEMNMBR">
                                                        <ColumnValidationSettings>
                                                            <ModelErrorMessage Text="" />
                                                        </ColumnValidationSettings>
                                                    </telerik:GridBoundColumn>
                                                    <telerik:GridBoundColumn DataField="Quantity" DataType="System.Int32" FilterControlAltText="Filter Quantity column" HeaderText="Quantity" SortExpression="Quantity" UniqueName="Quantity">
                                                        <ColumnValidationSettings>
                                                            <ModelErrorMessage Text="" />
                                                        </ColumnValidationSettings>
                                                    </telerik:GridBoundColumn>
                                                    <telerik:GridBoundColumn DataField="StartingLoc" FilterControlAltText="Filter StartingLoc column" HeaderText="Starting Location" SortExpression="StartingLoc" UniqueName="StartingLoc">
                                                        <ColumnValidationSettings>
                                                            <ModelErrorMessage Text="" />
                                                        </ColumnValidationSettings>
                                                    </telerik:GridBoundColumn>
                                                    <telerik:GridBoundColumn DataField="SendToLoc" FilterControlAltText="Filter SendToLoc column" HeaderText="Send To Location" SortExpression="SendToLoc" UniqueName="SendToLoc">
                                                        <ColumnValidationSettings>
                                                            <ModelErrorMessage Text="" />
                                                        </ColumnValidationSettings>
                                                    </telerik:GridBoundColumn>
                                                </Columns>
                                                <EditFormSettings>
                                                    <EditColumn FilterControlAltText="Filter EditCommandColumn column">
                                                    </EditColumn>
                                                </EditFormSettings>
                                                 
                                                <PagerStyle PageSizeControlType="RadComboBox" AlwaysVisible="True" PageSizes="20" />
                                                 
                                            </MasterTableView>
                                             
                                            <PagerStyle PageSizeControlType="RadComboBox" />
                                             
                                            <FilterMenu EnableImageSprites="False">
                                            </FilterMenu>
                                        </telerik:RadGrid>

    Setting the ToolTipZoneID:
    Protected Sub Page_Load(sender As Object, e As System.EventArgs) Handles Me.Load
        If Not IsPostBack Then
            RadToolTipManager1.ToolTipZoneID = gridQueue.ClientID
        End If
        RebindGrids() 'Rebinds all grids on the page
    End Sub
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Marin Bratanov
    Admin
    Marin Bratanov avatar
    3602 posts

    Posted 15 Apr 2013 Link to this post

    Hi Brandon,

    If you want only certain controls tooltipified I would advise that you add them as targets and avoid using the AutoTooltipify feature: http://demos.telerik.com/aspnet-ajax/tooltip/examples/targetcontrolsandajax/defaultcs.aspx?product=tooltip.

    The automatic tooltip generation goes through all possible HTML elements on the page and there isn't a way to have it exclude certain controls. You can try using the OnClientBeforeShow event and check for the target if this is a viable approach for you, e.g.:
    function OnClientBeforeShow(sender, args)
    {
        if (sender.get_targetControlID().indexOf("second") > -1)
        {
            args.set_cancel(true);
        }
    }
    <telerik:RadToolTipManager AutoTooltipify="true" ID="RadToolTipManager1" runat="server"
        OnClientBeforeShow="OnClientBeforeShow">
    </telerik:RadToolTipManager>
    <a id="first" title="first">first</a>
    <br />
    <a id="second" title="second">second</a>
    and the second link will have no tooltip shown, but will have one generated and its title attribute will be removed from the HTML.

    On using tooltip zones - there are some issues with them and partial page postbacks, so I can suggest you avoid them for more complex scenarios. Overall, the AutoTooltipify functionality is rather simplistic and cannot provide much flexibility and customizations. If you like I can provide a function override that can have the tooltip zones respected, but it will break other functionality (e.g. AjaxRequests) which is why it is not incorporated in the control's code.

    Greetings,
    Marin Bratanov
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  5. Brandon
    Brandon avatar
    6 posts
    Member since:
    Apr 2013

    Posted 15 Apr 2013 Link to this post

    This is the approach I'm trying now, which is almost identical to the demo, but I still can't get it working! 

    <telerik:RadToolTipManager ID="RadToolTipManager1" runat="server" Skin="Telerik" OffsetX="195" RelativeTo="Element" OnAjaxUpdate="AjaxUpdate"></telerik:RadToolTipManager>
    Protected Sub AjaxUpdate(sender As Object, e As ToolTipUpdateEventArgs) Handles RadToolTipManager1.AjaxUpdate
        Page.Items.Add("tID", e.Value)
        Dim ctrl As Control = Page.LoadControl("~/Management/Dashboard/TagToolTip.ascx")
        e.UpdatePanel.ContentTemplateContainer.Controls.Add(ctrl)
     
    End Sub
     
    Protected Sub gridQueue_ItemDataBound(sender As Object, e As GridItemEventArgs) Handles gridQueue.ItemDataBound
        If e.Item.ItemType = GridItemType.Item OrElse e.Item.ItemType = GridItemType.AlternatingItem Then
            Dim target As Control = e.Item.FindControl("HyperLink1")
            If Not target Is Nothing Then
                Dim val As String = TryCast(e.Item, GridDataItem).GetDataKeyValue("TagID").ToString()
                Me.RadToolTipManager1.TargetControls.Add(target.ClientID, val, True)
            End If
        End If
    End Sub
     
    Protected Sub gridQueue_ItemCommand(sender As Object, e As GridCommandEventArgs) Handles gridQueue.ItemCommand
        If e.CommandName = "Sort" OrElse e.CommandName = "Page" Then
            RadToolTipManager1.TargetControls.Clear()
        End If
    End Sub
    <telerik:AjaxSetting AjaxControlID="gridQueue">
        <UpdatedControls>
            <telerik:AjaxUpdatedControl ControlID="RadToolTipManager1"></telerik:AjaxUpdatedControl>
            <telerik:AjaxUpdatedControl ControlID="gridQueue" UpdatePanelCssClass="" />
        </UpdatedControls>
    </telerik:AjaxSetting>
  6. Marin Bratanov
    Admin
    Marin Bratanov avatar
    3602 posts

    Posted 18 Apr 2013 Link to this post

    Hi Brandon,

    Could you explain what is it that is not working in this case. After modifying the code a bit so I can run it it seems to work fine for me and there are tooltips for the hyperlinks. I would only advise that you do not set such large values for the Offset properties, because they are designed for fine tuning of the position and not for changing it completely.

    I am attaching here the page as I ran it as a reference. It is, indeed, very similar to the demo and there is no reason in it for major issues (apart from a few minor configurations in the manager that are advised here).

    You can also consider attaching client-side event handlers for the desired elements to generate tooltips as shown in this demo: http://demos.telerik.com/aspnet-ajax/tooltip/examples/radtooltipmanagerclientapi/defaultcs.aspx.

    If comparing your actual page with mine does not help you resolve the issue I advise that you modify my sample to show your problem and explain it in more detail so I can understand it and help.


    Regards,
    Marin Bratanov
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  7. Brandon
    Brandon avatar
    6 posts
    Member since:
    Apr 2013

    Posted 18 Apr 2013 Link to this post

    Marin - 

    Thank you for the sample code. It's working exactly as I'd expect and it looks near identical to my code. However, mine is still not functional. Stepping through the code I can see that it adds the target controls without issue, but the AjaxUpdate event is never fired. The grid is wrapped in a RadPageView control, I wouldn't think that would make a difference, but could it?
  8. Marin Bratanov
    Admin
    Marin Bratanov avatar
    3602 posts

    Posted 19 Apr 2013 Link to this post

    Hi Brandon,

    It should not make a difference. Are both the tooltip manager and the grid in the same pageview and same update panel (if there is one) or are updated with the same AJAX setting of a RadAjaxManager? I am aware of one scenario where event handlers are not raised and it is described here, so you can take a look at that article and see if it applies for you and fixes the problem.


    All the best,
    Marin Bratanov
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017