Telerik is a leading vendor of ASP.NET AJAX, ASP.NET MVC, Silverlight, WinForms and WPF controls and components, as well as .NET Reporting, .NET ORM , .NET CMS, Code Analysis, Mocking, Team Productivity and Automated Testing Tools. Building on its expertise in interface development and Microsoft technologies, Telerik helps customers build applications with unparalleled richness, responsiveness and interactivity. Telerik products help thousands of companies to be more productive and deliver reliable applications under budget and on time.
Version Q2 2011 released 07/12/2011
select

Splitter / Save State

Check the different configurations of RadSplitter and how they behave when a postback is performed.
Click on one of the "Postback" buttons to perform a postback.
Left Pane

This summer... Reporting and Windows Forms from telerik

The June issue of MSDN is out earlier than planned and this gives me freedom to blog about some very important developments in the telerik product offering. If you are an MSDN subscriber and you do not completely disregard the product ads, you might have noticed that "telerik is growing" and our ASP.NET product line will be soon complemented by a set of Windows Forms components and a Reporting tool.

If you are interested in getting more information and seeing a preview of the Telerik Reporting and Windows Forms product lines, please stop by booth 819 at TechEd USA to meet with our team. Till TechEd comes, I will be posting on my blog additional information about our upcoming products.

I can only hope that telerik customers are as excited as our team. We have done a lot to come up with a set of compelling products that will further streamline your development and will be a nice addition to your toolbox.

I would like to throw in a quick note that all holders of an active telerik RadControls subscription will get the Windows Forms and Reporting products at no cost as part of their subscriptions.
Top Pane
Change content URL
P
a
n
e
1
P
a
n
e
2
P
a
n
e
1
P
a
n
e
2
Left Pane - free size
Right Pane - free size
Left Pane - percent size - 20%
Right Pane - percent size - 80%
Left Pane - absolute size - 200px
Right Pane - free size
Left Pane - absolute size - 200px
Right Pane - absolute size - 100px
Left Pane - absolute size - 200px
Middle Pane - absolute size - 200px
Right Pane - free size


  • Persisting state

    The state of the RadSplitter control is saved across postbacks. The following Pane properties are persisted:
    • Width
    • Height
    • MinWidth,MaxWidth and MinHeight,MaxHeight
    • Collapsed state
    • Locked
    • Scrollers positions - use the PersistScrollPosition property to control whether to persist the scroll position across postbacks.
    • ContentUrl - only if the pane displays external content and its ContentUrl property is set throught the client-side API

    The following SlidingZone properties are persisted:
    • DockedPaneId
    • ExpandedPaneId
    • ClickToOpen

    The following SlidingPane properties are persisted:
    • Width
    • Height
    • MinWidth,MaxWidth and MinHeight,MaxHeight
    • Title
    • EnableResize
    • EnableDock

Source Code

C# VB.NET
Show code in new window Demo isolation steps
  • <%@ Register TagPrefix="qsf" TagName="Header" Src="~/Common/Header.ascx" %>
    <%@ Register TagPrefix="qsf" TagName="HeadTag" Src="~/Common/HeadTag.ascx" %>
    <%@ Register TagPrefix="qsf" TagName="Footer" Src="~/Common/Footer.ascx" %>
    <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

    <%@ Page Language="vb" CodeFile="DefaultVB.aspx.vb" AutoEventWireup="false" Inherits="Telerik.Web.Examples.Splitter.SaveState.DefaultVB" %>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <qsf:HeadTag ID="Headtag1" runat="server"></qsf:HeadTag>
    </head>
    <body class="BODY" style="margin: 0px">
        <form id="Form1" method="post" runat="server">
        <qsf:Header ID="Header1" runat="server" NavigationLanguage="VB"></qsf:Header>
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server" />
        <table cellpadding="10" cellspacing="10" border="0">
            <tr>
                <td colspan="2">
                    <div class="bigModule" style="margin-bottom: 40px">
                        <div class="bigModuleBottom">
                            Check the different configurations of RadSplitter and how they behave when a postback
                            is performed.<br />
                            Click on one of the "Postback" buttons to perform a postback.<br />
                        </div>
                    </div>
                    <asp:Button CssClass="button" runat="server" ID="Button1" Text="Postback" />
                </td>
            </tr>
            <tr>
                <td valign="top">
                    <telerik:RadSplitter ID="RadSplitter1" runat="server" Height="300" Width="300">
                        <telerik:RadPane ID="RadPane1" runat="server" Width="50">
                            Left Pane</telerik:RadPane>
                        <telerik:RadSplitBar ID="RadSplitbar1" runat="server" CollapseMode="Forward"></telerik:RadSplitBar>
                        <telerik:RadPane ID="Radpane2" runat="server">
                            <h2>
                                This summer... Reporting and Windows Forms from telerik
                            </h2>
                            The June issue of MSDN is out earlier than planned and this gives me freedom to
                            blog about some very important developments in the telerik product offering. If
                            you are an MSDN subscriber and you do not completely disregard the product ads,
                            you might have noticed that "telerik is growing" and our ASP.NET product line will
                            be soon complemented by a set of Windows Forms components and a Reporting tool.<br />
                            <br />
                            If you are interested in getting more information and seeing a preview of the Telerik
                            Reporting and&nbsp;Windows Forms product lines, please stop by booth 819 at TechEd
                            USA&nbsp;to meet with our team. Till TechEd comes, I will be posting on my blog&nbsp;additional
                            information about our upcoming&nbsp;products.<br />
                            <br />
                            I can only hope that telerik customers are as excited as our team. We have done
                            a lot to come up with a set of compelling products that will further streamline
                            your development and will be a nice addition to your toolbox.
                            <br />
                            <br />
                            I would like to throw in a quick note that all holders of an active&nbsp;telerik
                            RadControls subscription will get the Windows Forms and Reporting products at no
                            cost as part of their subscriptions.
                        </telerik:RadPane>
                    </telerik:RadSplitter>
                </td>
                <td valign="top">
                    <telerik:RadSplitter ID="Radsplitter2" runat="server" Height="300" Width="300" Orientation="Horizontal">
                        <telerik:RadPane ID="Radpane3" runat="server" Height="100">
                            Top Pane</telerik:RadPane>
                        <telerik:RadSplitBar ID="Radsplitbar2" runat="server" CollapseMode="Forward"></telerik:RadSplitBar>
                        <telerik:RadPane ID="Radpane4" runat="server" ContentUrl="http://www.google.com">
                        </telerik:RadPane>
                    </telerik:RadSplitter>
                    <a href="javascript:ChangePaneUrl()">Change content URL</a>
                </td>
            </tr>
            <tr>
                <td valign="top">
                    <telerik:RadSplitter ID="Radsplitter9" runat="server" Height="300" Width="300">
                        <telerik:RadPane ID="Radpane17" runat="server" Width="22" Scrolling="None">
                            <telerik:RadSlidingZone ID="SlidingZone1" runat="server" Width="22" ClickToOpen="true">
                                <telerik:RadSlidingPane ID="RadSlidingPane1" runat="server" Title="Pane1" Width="100">
                                    SlidingPane1 - 100px
                                </telerik:RadSlidingPane>
                                <telerik:RadSlidingPane ID="Radslidingpane2" runat="server" Title="Pane2" Width="150">
                                    SlidingPane2 - 150px
                                </telerik:RadSlidingPane>
                            </telerik:RadSlidingZone>
                        </telerik:RadPane>
                        <telerik:RadSplitBar ID="Radsplitbar9" runat="server" CollapseMode="Forward"></telerik:RadSplitBar>
                        <telerik:RadPane ID="Radpane18" runat="server">
                        </telerik:RadPane>
                    </telerik:RadSplitter>
                </td>
                <td valign="top">
                    <telerik:RadSplitter ID="Radsplitter10" runat="server" Height="300" Width="300">
                        <telerik:RadPane ID="Radpane19" runat="server">
                        </telerik:RadPane>
                        <telerik:RadSplitBar ID="Radsplitbar10" runat="server" CollapseMode="Forward"></telerik:RadSplitBar>
                        <telerik:RadPane ID="Radpane20" runat="server" Width="22" Scrolling="None">
                            <telerik:RadSlidingZone ID="Radslidingzone2" runat="server" Width="22" ClickToOpen="false"
                                DockedPaneId="Radslidingpane3" ExpandedPaneId="Radslidingpane4" SlideDirection="Left">
                                <telerik:RadSlidingPane ID="Radslidingpane3" runat="server" Title="Pane1" Width="100">
                                    SlidingPane3 - 100px
                                </telerik:RadSlidingPane>
                                <telerik:RadSlidingPane ID="Radslidingpane4" runat="server" Title="Pane2" Width="150">
                                    SlidingPane4 - 150px
                                </telerik:RadSlidingPane>
                            </telerik:RadSlidingZone>
                        </telerik:RadPane>
                    </telerik:RadSplitter>
                </td>
            </tr>
            <tr>
                <td>
                    <telerik:RadSplitter ID="Radsplitter3" runat="server" Height="300" Width="300">
                        <telerik:RadPane ID="Radpane5" runat="server">
                            Left Pane - <b>free</b> size</telerik:RadPane>
                        <telerik:RadSplitBar ID="Radsplitbar3" runat="server" CollapseMode="Forward"></telerik:RadSplitBar>
                        <telerik:RadPane ID="Radpane6" runat="server">
                            Right Pane - <b>free</b> size</telerik:RadPane>
                    </telerik:RadSplitter>
                </td>
                <td>
                    <telerik:RadSplitter ID="Radsplitter4" runat="server" Height="300" Width="300">
                        <telerik:RadPane ID="Radpane7" runat="server" Width="20%">
                            Left Pane - <b>percent</b> size - 20%</telerik:RadPane>
                        <telerik:RadSplitBar ID="Radsplitbar4" runat="server" CollapseMode="Forward"></telerik:RadSplitBar>
                        <telerik:RadPane ID="Radpane8" runat="server" Width="80%">
                            Right Pane - <b>percent</b> size - 80%</telerik:RadPane>
                    </telerik:RadSplitter>
                </td>
            </tr>
            <tr>
                <td>
                    <telerik:RadSplitter ID="Radsplitter5" runat="server" Height="300" Width="300">
                        <telerik:RadPane ID="Radpane9" runat="server" Width="200">
                            Left Pane - <b>absolute</b> size - 200px</telerik:RadPane>
                        <telerik:RadSplitBar ID="Radsplitbar5" runat="server" CollapseMode="Forward"></telerik:RadSplitBar>
                        <telerik:RadPane ID="Radpane10" runat="server">
                            Right Pane - <b>free</b> size</telerik:RadPane>
                    </telerik:RadSplitter>
                </td>
                <td>
                    <telerik:RadSplitter ID="Radsplitter6" runat="server" Height="300" Width="300">
                        <telerik:RadPane ID="Radpane11" runat="server" Width="200">
                            Left Pane - <b>absolute</b> size - 200px</telerik:RadPane>
                        <telerik:RadSplitBar ID="Radsplitbar6" runat="server" CollapseMode="Forward"></telerik:RadSplitBar>
                        <telerik:RadPane ID="Radpane12" runat="server" Width="100">
                            Right Pane - <b>absolute</b> size - 100px</telerik:RadPane>
                    </telerik:RadSplitter>
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    <telerik:RadSplitter ID="Radsplitter7" runat="server" Height="300" Width="600">
                        <telerik:RadPane ID="Radpane13" runat="server" Width="200">
                            Left Pane - <b>absolute</b> size - 200px</telerik:RadPane>
                        <telerik:RadSplitBar ID="Radsplitbar7" runat="server" CollapseMode="Forward"></telerik:RadSplitBar>
                        <telerik:RadPane ID="Radpane14" runat="server" Scrolling="none">
                            <telerik:RadSplitter ID="Radsplitter8" runat="server">
                                <telerik:RadPane ID="Radpane15" runat="server" Width="200">
                                    Middle Pane - <b>absolute</b> size - 200px</telerik:RadPane>
                                <telerik:RadSplitBar ID="Radsplitbar8" runat="server" CollapseMode="Forward"></telerik:RadSplitBar>
                                <telerik:RadPane ID="Radpane16" runat="server">
                                    Right Pane - <b>free</b> size</telerik:RadPane>
                            </telerik:RadSplitter>
                        </telerik:RadPane>
                    </telerik:RadSplitter>
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    <asp:Button runat="server" CssClass="button" ID="Button2" Text="Postback" />
                </td>
            </tr>
        </table>
        <br />

        <script type="text/javascript">
                    function ChangePaneUrl ()
                    {
                        $find("<%= Radsplitter2.ClientID %>").getPaneById("Radpane4").set_contentUrl("http://flickr.com");
                    }
        </script>

        <qsf:Footer runat="server" ID="Footer1"></qsf:Footer>
        </form>
    </body>
    </html>

Get more than expected!

 
 

Take your time to truly experience the power of RadControls for ASP.NET AJAX with a free 60-day trial backed up by Telerik’s unlimited dedicated support.

Download your RadControls for ASP.NET AJAX trial and jumpstart your development with the available Getting Started resources.

If you have any questions, do not hesitate to contact us at sales@telerik.com.

Copyright 2002-2024 © Telerik. All right reserved
Telerik Inc, 201 Jones Rd, Waltham, MA 02451