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

ToolTip Disappears

1 Answer 84 Views
ToolTip
This is a migrated thread and some comments may be shown as answers.
bill
Top achievements
Rank 1
bill asked on 28 Jun 2010, 09:42 PM
hello,
 trying to get you tooltip + calendar demo to work. i have everything working correctly aside from the toolTip display. It goes through its brief loading screen and then disappears without ever showing any of its content.

*page is referencing a nested master page that contains a ajaxscript manager not a radscript manager

page hosting calendar
<%@ Page Language="C#" AutoEventWireup="true"  MasterPageFile="~/Default.Master" CodeBehind="Events.aspx.cs" Inherits="MemberPortal.UI.Web.Site.Events" %> 
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
<asp:Content ContentPlaceHolderID="ContentPlaceHolder1" ID="ContentPlaceHolder1" runat="server">  
 
            <style type="text/css">  
                .style1  
                {  
                    width: 80%;  
                }  
                .style2  
                {  
                    width: 128px;  
                    height: 128px;  
                }  
                .style3  
                {  
                    width: 146px;  
                }  
                .style4  
                {  
                    font-family: Calibri;  
                    font-size: medium;  
                    color: #C0C0C0;  
                    border-left-color: #A0A0A0;  
                    border-right-color: #C0C0C0;  
                    border-top-color: #A0A0A0;  
                    border-bottom-color: #C0C0C0;  
                }  
                .Event  
        {  
            _ackground: #DFEEFF none repeat scroll 0 0;  
            background: #DFEEFF url(./Images/Appointment.png) center no-repeat;  
            border-color: #F6FAFF -moz-use-text-color #A7C0DF;  
            border-style: solid none;  
            border-width: 1px 0;  
        }  
            </style> 
            <table align="center" width="100%">  
                <tr> 
                    <td> 
                        &nbsp;  
                    </td> 
                </tr> 
                <tr> 
                    <td> 
                       <telerik:RadCalendar Skin="Hay" ID="RadCalendar1" Width="400" Height="300"    
                    runat="server" OnDayRender="RadCalendar1_DayRender" > 
                </telerik:RadCalendar> 
                <telerik:RadToolTipManager Width="220px" Height="300px" RelativeTo="Element" ID="RadToolTipManager1" 
                    runat="server" OffsetX="15" Position="MiddleRight" ShowDelay="0" OnAjaxUpdate="RadToolTipmanager1_AjaxUpdate" 
                    Skin="Hay">  
                </telerik:RadToolTipManager> 
                    </td> 
                </tr> 
                <tr> 
                    <td> 
                         
                    </td> 
                </tr> 
            </table> 
 
     
</asp:Content> 
 

page host calendar code behind
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;  
 
using System.IO;  
using System.Data.SqlClient;  
using System.Configuration;  
using Tegrit.MemberPortal.UI.Web.Site.Views;  
 
namespace MemberPortal.UI.Web.Site  
{  
    public partial class Events : System.Web.UI.Page  
    {  
        protected void Page_Load(object sender, EventArgs e)  
        {  
            if (!Page.IsPostBack)  
            {  
                List<EventInformationModel> events = new List<EventInformationModel>();  
                MockService service = new MockService();  
                events = service.GetEvents();  
                Session["Events"] = events;  
            }  
        }  
 
        protected void RadCalendar1_DayRender(object sender, Telerik.Web.UI.Calendar.DayRenderEventArgs e)  
        {  
            int ID = IsDayRegisteredForTooltip(e.Day.Date);  
            if (ID != -1)  
            {  
                TableCell cell = e.Cell;  
                cell.CssClass = "Event";  
                cell.Attributes.Add("id", "Calendar1_" + ID.ToString());  
                RadToolTipManager1.TargetControls.Add(e.Cell.Attributes["id"], ID.ToString().Substring(ID.ToString().IndexOf('_') + 1), true);  
            }  
        }  
 
        private int IsDayRegisteredForTooltip(DateTime date)  
        {  
            List<EventInformationModel> events = (List<EventInformationModel>)Session["Events"];  
            List<EventInformationModel> m = (from e in events  
                                             where e.Date == date  
                                             select e).ToList<EventInformationModel>();  
                if (m.Count > 0)  
                {  
                    return int.Parse(m[0].eventID.ToString());  
                }  
 
            return -1;  
 
            }  
 
        private EventInformationModel GetEventByID(int id)  
        {  
           List<EventInformationModel> events = (List<EventInformationModel>)Session["Events"];  
 
           EventInformationModel m = (from e in events  
                                            where e.eventID == id  
                                            select e).Single<EventInformationModel>();  
           return m;  
        }  
 
        protected void RadToolTipmanager1_AjaxUpdate(object sender, ToolTipUpdateEventArgs e)  
        {  
            EventDetailsView details = (EventDetailsView)this.LoadControl("views/EventDetailsView.ascx");  
            int eventID = int.Parse(e.Value);  
            details.EventDetail = GetEventByID(eventID);  
            e.UpdatePanel.ContentTemplateContainer.Controls.Add(details);  
        }  
    }  

user control for tooltip display
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="EventDetailsView.ascx.cs" Inherits="MemberPortal.UI.Web.Site.Views.EventDetailsView" %> 
<style type="text/css">  
    .style1  
    {  
        width: 200px;  
        height: 118px;  
    }  
</style> 
<table id="Table1"  border="0" cellpadding="2" 
    cellspacing="0">  
    <tr> 
        <td style="text-align: center;" class="style1">  
 
              
                    Name:  
                    <asp:Label ID="lblName"  runat="server" Text='<%# Bind("Name") %>'></asp:Label><br /> 
                    Start:  
                    <asp:Label ID="lblStartTime"  runat="server" Text='<%# Bind("StartTime") %>'></asp:Label><br /> 
                    End:  
                    <asp:Label ID="lblStartTime2" runat="server" Text='<%# Bind("StartTime") %>'></asp:Label><br /> 
                    Person to meet with:  
                    <asp:Label ID="lblEndTime"  runat="server" Text='<%# Bind("EndTime") %>'></asp:Label><br /> 
                    <br /> 
 
        </td> 
    </tr> 
</table> 

page hosting tooltip dispaly code behind
using System;  
using System.Collections.Generic;  
using System.Linq;  
using System.Web;  
using System.Web.UI;  
using System.Web.UI.WebControls;  
using MemberPortal.UI.DataTransferObjects.ContentManagement;  
 
namespace MemberPortal.UI.Web.Site.Views  
{  
    public partial class EventDetailsView : System.Web.UI.UserControl  
    {  
        private EventInformationModel eventDetail;  
 
        public EventInformationModel EventDetail  
        {  
            get { return eventDetail; }  
            set { eventDetail = value; }  
        }  
 
 
        protected void Page_Load(object sender, EventArgs e)  
        {  
            lblEndTime.Text = eventDetail.EndTime;  
            lblName.Text = eventDetail.Name;  
            lblStartTime.Text = eventDetail.StartTime;  
              
        }  
    }  

1 Answer, 1 is accepted

Sort by
0
Svetlina Anati
Telerik team
answered on 01 Jul 2010, 01:08 PM
Hi bill,

Your code seems to be correct and the only thing I can assume that might be causing the problem you report is that you have ajaxified the RadCalendar and the RadToolTipManager. If so, note that the RadToolTipManager uses internally AJAX if used with LOAD functionality and thus you probably get nested update panels as a result.

To test my assumption, please remove all the AJAX settings from your page and check whether the issue persists. If it disappears, the assumption is correct and what you should do is to replace the AJAX settings with standard update panels with UpdateMode="Conditional" - this will prevent the outermost update panel from update when the tooltip is being shown. More information about nested update panels is available below:

http://geekswithblogs.net/ranganh/archive/2007/05/16/112525.aspx

In case my assumption is not correct or you need further assistance, please prepare a sample, fully runnable reproduction demo, open a new support ticket and send it to me along with detailed explanations of the reproduction steps and I will do my best to help.

 



All the best,
Svetlina
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
Tags
ToolTip
Asked by
bill
Top achievements
Rank 1
Answers by
Svetlina Anati
Telerik team
Share this question
or