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. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top