RadSplitter - BorderSize=0 - Splitter doesn't render

2 posts, 0 answers
  1. David
    David avatar
    38 posts
    Member since:
    May 2013

    Posted 27 Jan 2014 Link to this post

    I have a problem were the splitter doesn't render properly when BorderSize = 0

    At the bottom of this post is how I want the code to be.

    I have set BorderSize="0" to get rid of the borders and I have OnClientLoaded calling javascript function SplitterLoaded so that the Height of the Splitter is equal to the content.

    when the page loads, its fine. when I change the size of the browser though (without reloading the page), the Splitter completely disappears - apart from the button that does the collapsing of the panels.

    When I remove the BorderSize="0" tag, it works fine.
    so I can change the size of the browser by double-clicking the top of the browser window so that it makes the window slightly smaller, or I can start with the window smaller (not filling the full screen) and then drag from the edges of the browser to make it bigger/smaller.

    both ways will result in the Splitter not showing properly
    <div id="content">
                       <telerik:RadSplitter BorderSize="0" OnClientLoaded="SplitterLoaded"   VisibleDuringInit="false"  ID="RadSplitter2" Width="100%" Height="100%" runat="server" Orientation="Vertical">
                           <telerik:RadPane ID="pane1" runat="server" Width="120px"
                               <div class="sidebar">
                                   <comx:VMenu ID="VMenu" runat="server" />
                           <telerik:RadSplitBar EnableResize="false" CollapseMode="Forward" ID="RadSplitBar1" runat="server">
                           <telerik:RadPane ID="pane2" runat="server" >
                                   <div class="workingarea_splitter">
                                       <comx:Menubar ID="MenuBar" runat="server" />
                                       <asp:Label ID="lblItemName" runat="server" CssClass="itemname" />
                                       <asp:Label ID="lblError" runat="server" CssClass="invisible" />
                                       <asp:ContentPlaceHolder ID="Content" runat="server" />

    function SplitterLoaded(splitter, arg) {
        var pane = splitter.getPaneById('<%= pane2.ClientID %>');
        var height = pane.getContentElement().scrollHeight;
        splitter.set_height(splitter.get_height() - pane.get_height() + height);

  2. David
    David avatar
    38 posts
    Member since:
    May 2013

    Posted 27 Jan 2014 in reply to David Link to this post

    easy fix! add 


    to the RadSplitter
  3. DevCraft R3 2016 release webinar banner
Back to Top