RadOrgChart w/Tooltip: Tooltip never pops up

1 posts, 0 answers
  1. Andres
    Andres avatar
    1 posts
    Member since:
    Dec 2016

    Posted 08 Dec 2016 Link to this post

    Hi!

     

    I'm in need of using the RadOrgChart for showing some data and the point of the Tooltip is to show details of the Item I'm hovering over.

    I did a demo just to try and see how it would look with some basic data on a Table.

    I used this Demo as a reference...pretty much, I just copied and pasted it and modified it to see how it would look and then I would start doing some changes on it.

    My problem: I don't know if its what I'm thinking, that the OnAjaxUpdate is not getting triggered, or if I messed up somewhere else.

    I've never tried this before, so I'm pretty new at this and a little help would be useful ^^

    OrgChartNew.aspx:

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="OrgChartNew.aspx.cs" Inherits="RadOrgChart3.OrgChartNew" %>
     
    <!DOCTYPE html>
     
    <head runat="server">
        <title></title>
        <link href="css/styles.css" rel="stylesheet" />
    </head>
    <body>
        <form id="form1" runat="server">
        <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
        <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
        <div class="demo-container size-wide no-bg">
            <div class="qsf-demo-canvas">
                <h2>
                    <span>Test</span>
                </h2>
      
                <telerik:RadOrgChart RenderMode="Lightweight" ID="RadOrgChart1" runat="server" Skin="Default" DataSourceID="SqlDataSource1" EnableDrillDown="true"
                    DataFieldID="hijo" DataFieldParentID="padre">
                    <ItemTemplate>
                        <asp:Panel runat="server" ID="Panel1" CssClass="TemplateHolder">
                            <div class="rocCustomTextWrap">
                                <span>
                                    <%# Eval("nombre")%>
                                </span>
                            </div>
                        </asp:Panel>
                    </ItemTemplate>
                </telerik:RadOrgChart>
            </div>
      
        </div>
        <telerik:RadToolTipManager RenderMode="Lightweight" runat="server" ID="RadToolTipManager1" Skin="Default" OnAjaxUpdate="OnAjaxUpdate"
            Position="BottomRight" OffsetX="16" OffsetY="16" EnableShadow="false" Width="195" Height="135" />
      
        <asp:SqlDataSource runat="server" ID="SqlDataSource1" ConnectionString="<%$ ConnectionStrings:masterConnectionString %>"
            SelectCommand="SELECT [hijo], [padre], [nombre], [edad], [color] FROM [PADREHIJOTABLETEST]"></asp:SqlDataSource>
      
        </form>
    </body>
    </html>

     

    OrgChartNew.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 RadOrgChart3
    {
        public partial class OrgChartNew : System.Web.UI.Page
        {
            private bool isDrillDown = false;
     
            protected void Page_Load(object sender, EventArgs e)
            {
                RadOrgChart1.GroupItemDataBound += new Telerik.Web.UI.OrgChartGroupItemDataBoundEventHandler(RadOrgChart1_GroupItemDataBound);
                RadOrgChart1.DrillDown += RadOrgChart1_DrillDown;
            }
     
            void RadOrgChart1_DrillDown(object sender, OrgChartDrillDownEventArguments e)
            {
                isDrillDown = true;
            }
     
            void RadOrgChart1_GroupItemDataBound(object sender, Telerik.Web.UI.OrgChartGroupItemDataBoundEventArguments e)
            {
                var panel = (Panel)e.Item.FindControl("Panel1");
                RadToolTipManager1.TargetControls.Add(panel.ClientID, e.Item.Node.ID, true);
            }
     
            protected override void OnPreRenderComplete(EventArgs e)
            {
                base.OnPreRenderComplete(e);
     
                if (isDrillDown)
                {
                    var nodes = RadOrgChart1.GetAllNodes();
     
                    foreach (var node in nodes)
                    {
                        var panel = (Panel)node.GroupItems[0].FindControl("Panel1");
                        RadToolTipManager1.TargetControls.Add(panel.ClientID, node.ID, true);
                    }
                }
            }
     
            public void OnAjaxUpdate(object sender, ToolTipUpdateEventArgs e)
            {
                Control ctrl = Page.LoadControl("OrgChartUC.ascx");
                ctrl.ID = "OrgChartUC";
     
                e.UpdatePanel.ContentTemplateContainer.Controls.Add(ctrl);
                OrgChartUC details = (OrgChartUC)ctrl;
                details.Hijo = e.Value;
            }
     
        }
    }

     

    OrgChartUC.ascx:

    <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="OrgChartUC.ascx.cs" Inherits="RadOrgChart3.OrgChartUC" %>
     
    <asp:Repeater runat="server" ID="Repeater1">
        <ItemTemplate>
            <div class="rtCustomTemplate">
                <h3 class="title">
                    <asp:Literal runat="server" ID="ltrEdad" Text='<%# Eval("edad")%>' />
                </h3>
                <p class="phone">
                    <asp:Literal runat="server" ID="ltrColor" Text='<%# Eval("color")%>' />
                </p>
            </div>
        </ItemTemplate>
    </asp:Repeater>
      
    <asp:SqlDataSource ID="EmployeesDataSource" runat="server" ConnectionString="<%$ ConnectionStrings:masterConnectionString %>"
        ProviderName="System.Data.SqlClient" SelectCommand="SELECT [edad], [color] FROM [PADREHIJOTABLETEST] WHERE hijo = @hijo">
        <SelectParameters>
            <asp:Parameter Name="hijo" Type="Int32" />
        </SelectParameters>
    </asp:SqlDataSource>

     

    OrgChart.ascx.cs:

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
     
    namespace RadOrgChart3
    {
        public partial class OrgChartUC : System.Web.UI.UserControl
        {
            public string Hijo { get; set; }
     
            protected void Page_Load(object sender, EventArgs e)
            {
                EmployeesDataSource.SelectParameters["hijo"].DefaultValue = Hijo;
                Repeater1.DataSource = EmployeesDataSource;
                Repeater1.DataBind();
            }
        }
    }

     

    Thanks for your help ^^!!!

Back to Top