Server Side Sliding Pane Close

8 posts, 0 answers
  1. Kyle Schiele
    Kyle Schiele avatar
    20 posts
    Member since:
    Aug 2012

    Posted 19 Aug 2008 Link to this post

    Hello

    Can someone suggest a server side approch to closing a docked and or expanded sliding pane?

    Setting the expandid id or the docked id to a non existant panel did not work.

    Kyle
  2. Tsvetie
    Admin
    Tsvetie avatar
    1517 posts

    Posted 25 Aug 2008 Link to this post

    Hi Kyle Schiele,
    You can just set the ExpandedPaneId and DockedPaneId properties of the RadSlidingZone to empty strings. For example:
    protected void Button1_Click(object sender, EventArgs e)  
    {  
        this.RadSlidingZone1.ExpandedPaneId = string.Empty;  
        this.RadSlidingZone1.DockedPaneId = string.Empty;  

    <telerik:RadSplitter ID="RadSplitter1" runat="server">  
        <telerik:RadPane ID="RadPane1" runat="server" Width="22px" Scrolling="None">  
            <telerik:RadSlidingZone ID="RadSlidingZone1" runat="server">  
                <telerik:RadSlidingPane ID="RadSlidingPane1" runat="server" Title="Test">  
                    <asp:Button ID="Button1" runat="server" Text="Collapse sliding pane"   
                        OnClick="Button1_Click" /> 
                </telerik:RadSlidingPane> 
            </telerik:RadSlidingZone> 
        </telerik:RadPane> 
        <telerik:RadPane ID="RadPane2" runat="server">  
        </telerik:RadPane> 
    </telerik:RadSplitter> 

    Best wishes,
    Tsvetie
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Kyle Schiele
    Kyle Schiele avatar
    20 posts
    Member since:
    Aug 2012

    Posted 26 Aug 2008 Link to this post

    The above approach when the sliding pane is docked does not release the space the sliding pane was occupying. Is this a bug?
  5. Sophy
    Admin
    Sophy avatar
    636 posts

    Posted 27 Aug 2008 Link to this post

    Hi Kyle Schiele,

    Setting the DockedPaneId to an empty string will undock the pane but nothing will make it resize to the correct size as the panes preserve their width and height after a postback. It depends on your exact scenario how you will implement this behavior. I could suggest you two options - dock/undock the slidingpane registering script which docks/undocks the pane client-side using the splitter's client-side API or set the Width property of the splitter's panes after undocking the pane server-side with DockedPaneId set to an empty string, e.g.:
    protected void Button1_Click(object sender, EventArgs e)  
    {  
        this.RadSlidingZone1.ExpandedPaneId = string.Empty;  
        this.RadSlidingZone1.DockedPaneId = string.Empty;    
        RadPane1.Width = Unit.Pixel(22);  
        RadPane2.Width = Unit.Pixel(400);  
    Let us know if you need further assistance.

    Kind regards,
    Sophy
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  6. RSI
    RSI avatar
    80 posts
    Member since:
    Nov 2011

    Posted 27 Oct 2013 Link to this post

    Is there a way to do this client side?

    I have a splitter with a slinding pane. in the pane is a radtreeview. when the user clicks the node it needs to collapse (undock) the radslidingzone that contains the treeview. (and grid you can see from code)


    <telerik:RadSlidingPane ID="RadSlidingPaneGroups" runat="server" Width="230px" Title="Groups"
                            DockOnOpen="true" EnableDock="true" MinWidth="230" TabView="ImageOnly" IconUrl="~/RegisterPro/images/Menu/group.png">
                            <telerik:RadGrid ID="RadGridPrograms" runat="server" Width="225px" Height="200px" Visible="false">
                                <MasterTableView ClientDataKeyNames="ProgramId, Name" DataKeyNames="ProgramId, Name" AutoGenerateColumns="false">
                                    <Columns>                                   
                                        <telerik:GridBoundColumn Display="false" UniqueName="ProgramId" DataField="ProgramId" />
                                        <telerik:GridBoundColumn HeaderText="Program Name" UniqueName="Name" DataField="Name" />
                                    </Columns>
                                </MasterTableView>
                                <ClientSettings EnablePostBackOnRowClick="true" Selecting-AllowRowSelect="true" />
                            </telerik:RadGrid>
                            <telerik:RadTreeView ID="RadTreeViewGroups" runat="server" Width="225px" Height="800px" OnClientNodeClicked="RadTreeViewGroups_OnClientNodeClicked">                           
                                <Nodes>                               
                                    <telerik:RadTreeNode runat="server" Value="1" ExpandMode="ClientSide" Text="Master Level" />
                                </Nodes>                           
                            </telerik:RadTreeView>
                        </telerik:RadSlidingPane>


    The OnClientNodeClicked="RadTreeViewGroups_OnClientNodeClicked" event fires of some js and i want the slidingpane to undock and collapse.

    tried this and it didnt work and just "....collapse();
    ....
    // collapse the pane
                    var slidingZone = $find('<%= RadSlidingZone1.ClientID%>');
                    var slidingPane = slidingZone.getPaneById('<%=RadSlidingPaneGroups%>');
     
                    if (slidingPane) {
                        slidingPane.collapse = false;
                    }

    I didnt see anything in your documentation on this. is it possible in javascript?

    Thanks!
  7. Vessy
    Admin
    Vessy avatar
    1383 posts

    Posted 30 Oct 2013 Link to this post

    Hello,

    To collapse/expand a SlidingPane you have to use its parent SlidingZone's collapsePane() and/or expandPane() method, passing the desired SlidingPane ID as its argument. You can find more detailed information on the SligingZone Client-Side API here: RadSlidingZone Client Object

    I hope this helps.

    Regards,
    Veselina Raykova
    Telerik
    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 the blog feed now.
  8. RSI
    RSI avatar
    80 posts
    Member since:
    Nov 2011

    Posted 02 Nov 2013 Link to this post

    Got it thanks! I actually needed to undock not collapse it. So you sent me in the right direction.

    // undock the pane
    var mySlidingZone = $find('<%= RadSlidingZone1.ClientID%>');
    mySlidingZone.undockPane('<%=RadSlidingPaneGroups.ClientID%>');
  9. Vessy
    Admin
    Vessy avatar
    1383 posts

    Posted 04 Nov 2013 Link to this post

    Hi Brian,

    I am glad my suggestion was helpful for you - feel free to contact us in case any further questions occur.

    Regards,
    Veselina Raykova
    Telerik
    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 the blog feed now.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017