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

[Solved] RadToolTipManager & RadDatePicker?

2 Answers 149 Views

ToolTip

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

Evgeniy asked on 19 Feb 2009, 03:29 PM

Hi All!

I used RadToolTipManager on my aspx page:

    
            <telerik:RadToolTipManager ID="ttEditSeason" runat="server" ManualClose="True" OnAjaxUpdate="ttEditSeason_AjaxUpdate" Position="TopRight" RelativeTo="Element" ShowEvent="OnClick" Width="950px" Height="200px" Skin="Web20"> 
        
            </telerik:RadToolTipManager>

and his AjaxUpdate event

    
            protected void ttEditSeason_AjaxUpdate(object sender, Telerik.Web.UI.ToolTipUpdateEventArgs e) 
        
            { 
        
                    Control ctrl = Page.LoadControl("~/user/EditSeason.ascx"); 
        
                    e.UpdatePanel.ContentTemplateContainer.Controls.Add(ctrl); 
        
            }

So, I load my user control in ToolTip (I get it from example http://demos.telerik.com/aspnet-ajax/tooltip/examples/loadondemand/defaultcs.aspx).
In my user control exist RadDatePicker. But when I click on DatePopupButton then popup calendar displaying under tooltip area. Why?

It code from my user control ascx page:

    
                                            <telerik:RadDatePicker ID="dpBeginDate" runat="server" Width="150px" Skin="WebBlue" Culture="English (United States)" EnableTyping="False" AutoPostBack="True"> 
        
                                                <DateInput LabelCssClass="riLabel radLabelCss_WebBlue" Skin="WebBlue" ReadOnly="True" Width="" AutoPostBack="True"> 
        
                                                </DateInput> 
        
                                                <Calendar Skin="WebBlue" UseColumnHeadersAsSelectors="False" UseRowHeadersAsSelectors="False" 
        
                                                    ViewSelectorText="x"> 
        
                                                </Calendar> 
        
                                                <DatePopupButton CssClass="radPopupImage_WebBlue" HoverImageUrl="~/Images/DatePicker.png" ImageUrl="~/Images/DatePicker.png" /> 
        
                                            </telerik:RadDatePicker> 
        
                                        </td> 
        
                                        <td> 
        
                                            <telerik:RadDatePicker ID="dpEndDate" runat="server" Width="150px" Skin="WebBlue" Culture="English (United States)" EnableTyping="False"> 
        
                                                <DateInput LabelCssClass="radLabelCss_WebBlue" Skin="WebBlue" ReadOnly="True" Width=""> 
        
                                                </DateInput> 
        
                                                <Calendar Skin="WebBlue" UseColumnHeadersAsSelectors="False" UseRowHeadersAsSelectors="False" 
        
                                                    ViewSelectorText="x"> 
        
                                                </Calendar> 
        
                                                <DatePopupButton CssClass="radPopupImage_WebBlue" HoverImageUrl="~/Images/DatePicker.png" ImageUrl="~/Images/DatePicker.png" /> 
        
                                            </telerik:RadDatePicker> 
        
            <br /> 
        
            <asp:Button id="btn" runat="server" text="Ok" />

Any ideas?

Thanks!

2 Answers, 1 is accepted

answered on 23 Feb 2009, 10:39 AM

Hello Evgeniy,

The described behavior is due to z-index of RadToolTip being bigger than the one of RadCalendar. The easiest possible solution is to set lower z-index to the tooltip as shown below:

    
                <telerik:RadToolTipManager ID="ttEditSeason" runat="server" style="z-index: 4900" ManualClose="True" OnAjaxUpdate="ttEditSeason_AjaxUpdate" 
        
                        Position="TopRight" RelativeTo="Element" ShowEvent="OnClick" Width="950px" Height="200px" 
        
                        Skin="Web20">

You can find more information about z-indexes in the article below:

http://www.telerik.com/help/aspnet-ajax/controlling-absolute-positioning-with-zindex.html

Best wishes,
Svetlina
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.