RadSplitter and RadSplitBar design issue

[ankammarao]

Hi,

I am using RadSplitter , RadSplitBar and RadPane in one of my project, I have design my page like
<RadSplitter > 
    <RadPane1 > </RadPane1 > 
    <RadSplitBar CollapseMode="Both"> </RadSplitBar >
     <RadPane2> </RadPane2>
</RadSplitter >

 

I kept my RadSplitBar  at middle but when I try to perform any action on RadSplitBar its not persisting the position, first its going to down and when I perform the action then again its comming to middle

but I need to Keep my RadSplitBar  at Fixed location that is on middle of page even if i perfrom any action over it(expand / collpase)

Can anyone suggest any solution for this

[Dobromir]

Hello Ankammarao,

The required functionality is not supported out of the box. By design, the expand / collapse functionality resizes the visible pane, causing the SplitBar to change its position.

Could you please provide more detailed information what exactly you want to achieve and why do you want to have "static" splitbar so we can try to provide suitable solution.

Best wishes,
Dobromir
the Telerik team

[Aarsh]

I too am having a similar scenario:

Left Rad-pane [Rad-splitter] Right Rad-pane

The one on left has just some asp.net / telerik text boxes, labels and text areas

But the right one has the Rad-sliding pane, which in turn contains an IFrame.

What happens when I run:
initially the left pane and right pane loads up as I expect, but as soon as I expand the sliding pane the Rad-Splitter bar gallops to the right edge but not all the way to the right edge, it keeps almost 200px or so from the edge on right ... possibly due to the min -width I specified ?


Also I wonder why the sliding pane does not get docked on load ...

I can share just the partial code....

<telerik:RadPane ID="LeftPane" runat="server" Width="40%" Scrolling="Both">
    <%--my code here...--%>
</telerik:RadPane>

<telerik:RadSplitBar ID="Splitter" runat="server" CollapseMode="None"></telerik:RadSplitBar>

<telerik:RadPane ID="RightPane" runat="server" Width="60%" Scrolling="Both" Collapsed="false" MinWidth="250">
         <telerik:RadSlidingZone ID="SlidingZone1" runat="server" Width="15px" SlideDirection="Right" ClickToOpen="false">
                 <telerik:RadSlidingPane ID="telerikPane" runat="server" Title="Scan Viewer" PersistScrollPosition="true" DockOnOpen="true">
                         <telerik:RadCodeBlock ID="CodeBlock" runat="server">
                                    <iframe id="iFrame" runat="server" width="100%" height="100%" frameborder="0" scrolling="yes">
                                    </iframe>
                        </telerik:RadCodeBlock>
              </telerik:RadSlidingPane>
   </telerik:RadSlidingZone>
</telerik:RadPane>

[Vessy]

Hi Aarsh,

The most probable reason for the described behavior is caused by the RadSplidingZone's configuration. There are several recommendations about its configuration which should be followed in order to make it work properly:

• RadSpliding zone must be placed inside a dedicated to it RadPane, which recommended width is 22px (as well as the RadSplidingZone's width should be set to 22px).
• The desired SplidingPane width should be configured only for the SlidingPane itself.
• In order to make a SlidingPane get docked on page load, its id must be set as a value of the RadSidingZone's DockedPaneId property.

You could find more useful information on the subject on the following live demo:Splitter / Initial State and help article:Declaring Sliding Zones.

For your convenience I am attaching a sample project, demonstrating how to configure the SlidingZone, following the above mentioned approach.

Kind regards,
Vesi
the Telerik team