Splitter - Enable Resizing/Docking

Pane1
Pane2
Pane3
Main Pane
Isolate this demo as a stand-alone application
  • About this demo
  • C#
  • VB

You can enable/disable the docking and resizing of the sliding panes using the EnableResize and EnableDock properties.

  • DefaultCS.aspx
<%@ Page Language="c#" AutoEventWireup="false"  %>

<!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">
    <title>Telerik ASP.NET Example</title>
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
    <div class="demo-container size-wide">
        <telerik:RadSplitter RenderMode="Lightweight" ID="RadSplitter1" runat="server" Height="400" Width="800">
            <telerik:RadPane ID="LeftPane" runat="server" Width="22" Scrolling="None">
                <telerik:RadSlidingZone ID="SlidingZone1" runat="server" Width="22">
                    <telerik:RadSlidingPane ID="Pane1" Title="Pane1" runat="server" Width="150" EnableResize="false">
                        This pane has the <strong>EnableResize</strong> property set to false.<br />
                        The default value of the property is <strong>true</strong>.<br />
                        <br />
                        You can dock the pane to see that even when docked the pane is still not resizable.
                    </telerik:RadSlidingPane>
                    <telerik:RadSlidingPane ID="Pane2" Title="Pane2" runat="server" Width="150" EnableDock="false">
                        This pane has the <strong>EnableDock</strong> property set to false.<br />
                        The default value of the property is <strong>true</strong>.<br />
                        <br />
                        You can only resize and close this pane.
                    </telerik:RadSlidingPane>
                    <telerik:RadSlidingPane ID="Pane3" Title="Pane3" runat="server" Width="150" EnableDock="false"
                        EnableResize="false">
                        This pane has both the <strong>EnableDock</strong> and <strong>EnableResize</strong>
                        properties set to false.<br />
                        The default value of both properties is <strong>true</strong>.<br />
                        <br />
                        You can only close the pane.
                    </telerik:RadSlidingPane>
                </telerik:RadSlidingZone>
            </telerik:RadPane>
            <telerik:RadSplitBar ID="RadSplitbar1" runat="server">
            </telerik:RadSplitBar>
            <telerik:RadPane ID="MiddlePane" runat="server">
                Main Pane
            </telerik:RadPane>
        </telerik:RadSplitter>
    </div>
    </form>
</body>
</html>

Find Assistance

Help Us Improve

Was this example helpful?