RadRotator inside collapsed RadDock

4 posts, 0 answers
  1. Kelly
    Kelly avatar
    4 posts
    Member since:
    Mar 2009

    Posted 30 Mar 2009 Link to this post

    I'm having an issue with a RadRotator control when the containing RadDock is collapsed. I've traced it to the get_currentItem method of the RadRotator object. More specifically, I think it is the result of the $telerik.getOuterSize function not being able to return the correct box styles of hidden (display:none) objects.
    Is there some event that can be used to inform the RadRotator that it is about to be hidden so it can stop the slideshow?
  2. Kelly
    Kelly avatar
    4 posts
    Member since:
    Mar 2009

    Posted 30 Mar 2009 Link to this post

    I have come up with a basic solution.
    When the RadDock is expanded/collapsed, it finds the contained RadRotator and calls the appropriate resume or pause method.
    This lead to an observation. The documentation (1st quarter 2009) states that the client-side OnClientCommand event occurs before the built-in command types perform their default action. This does not seem to be the case with the DockExpandCollapseCommand object, which calls the set_collapse method of the RadDock before calling the onCommand method of the base class. Therefore, before my code has a chance to prevent the expand or collapse action, the action has already taken place.
  3. James Van Buren
    James Van Buren avatar
    31 posts
    Member since:
    May 2007

    Posted 15 May 2009 Link to this post

    I see similar behavior. When dock with radrotator is colapsed i get JS error 'control' is null or not an object.
    Rotator no longer scrolls after this error and the dock has been expanded.
    Is there a resolution to this? Also what about text formating to unreadable with scroll of radrotator, i reported it earlier, you mentioned that it will be fixed in SP1, but it does still happen.
  4. Obi-Wan Kenobi
    Obi-Wan Kenobi  avatar
    460 posts
    Member since:
    Aug 2007

    Posted 25 May 2009 Link to this post

    A workaround for this problem is to pause a Rotator before the RadDock is collapsed and resume it after the RadDock is expanded. I created a custom command("CustomExpand") which collapse/expand RadDock and pause/resume RadRotator,e.g.

    <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %> 
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    <html xmlns="http://www.w3.org/1999/xhtml">  
    <head id="Head1" runat="server">  
        <title></title>  
        <script type="text/javascript">  
            var rotator;  
            function RotatorLoad(obj, args) {  
                rotator = obj;  
            }  
            function CustomExpand(dock, args) {  
                if (args.Command.get_state() == 1) {  
                    args.Command.set_state(2);  
                    //pause the Rotator  
                    rotator.pause();  
                    //collapse RadDock  
                    dock.set_collapsed(true);  
                }  
                else {  
                    args.Command.set_state(1);  
                    //expand RadDock  
                    dock.set_collapsed(false);  
                    //resume Rotator  
                    rotator.resume();  
                }  
            }  
          
        </script> 
    </head> 
    <body> 
        <form id="form1" runat="server">  
        <asp:ScriptManager ID="ScriptManager1" runat="server">  
        </asp:ScriptManager> 
        <div> 
        <telerik:RadDockLayout ID="RadDockLayout1" runat="server" Skin="Vista">  
                        <telerik:RadDockZone ID="RadDockZone1" runat="server" Width="250" > 
                            <telerik:RadDock ID="RadDock1" runat="server" Title="RadDock1" Width="200px">  
                                <Commands> 
                                    <telerik:DockToggleCommand   
                                    CssClass="rdCollapse"   
                                    AlternateCssClass="rdExpand" 
                                    Name="CustomExpand" 
                                    Text="Collapse" 
                                    AlternateText="Expand"   
                                    OnClientCommand="CustomExpand"/>  
                                </Commands> 
                                <ContentTemplate> 
                                    <telerik:RadRotator ID="RadRotator1" runat="server" OnClientLoad="RotatorLoad">  
                                        <Items> 
                                            <telerik:RadRotatorItem> 
                                                <ItemTemplate> 
                                                    aaaaaaaaaaaaaaaaaa  
                                                </ItemTemplate> 
                                            </telerik:RadRotatorItem> 
                                            <telerik:RadRotatorItem> 
                                                <ItemTemplate> 
                                                    bbbbbbbbbbbbbbbbbb  
                                                </ItemTemplate> 
                                            </telerik:RadRotatorItem> 
                                        </Items> 
                                    </telerik:RadRotator>      
                                </ContentTemplate> 
                            </telerik:RadDock> 
                        </telerik:RadDockZone> 
                        <telerik:RadDockZone ID="RadDockZone2" runat="server" Width="300px"></telerik:RadDockZone> 
                          
         </telerik:RadDockLayout> 
         <asp:Label ID="Label1" runat="server" Text="aaa"></asp:Label>    
         <asp:Button ID="Button1" runat="server" Text="Postback"/>  
          </div> 
        </form> 
    </body> 
    </html> 
Back to Top