Problem with height of Dock

2 posts, 0 answers
  1. Andreas
    Andreas avatar
    143 posts
    Member since:
    May 2008

    Posted 13 Jun 2013 Link to this post


    I posted a major issue that happened in the Q2 Beta:

    You said that this would be solved in the Q2 release, but it isn't solved...
    The link to my original thread doesn't work anymore so here we go again:

    <%@ Page Language="vb" AutoEventWireup="false" CodeBehind="dock.aspx.vb" Inherits="TestaTredjepartWeb.dock" %>
    <!DOCTYPE html>
    <head runat="server">
        <form id="form1" runat="server">
                <asp:ScriptManager ID="s" runat="server" ScriptMode="Debug">
                <telerik:RadDockZone runat="server" ID="dz" RenderMode="Lightweight">
                    <telerik:RadDock runat="server" ID="RadDock2" RenderMode="Lightweight">
                            <asp:Button ID="btn" runat="server" Text="Click me" OnClientClick="var divExpand = $get('divExpand'); if('none')'block'; else'none'; return false;" />
                            <div id="divExpand" style="display: none">

    Clicking on the button works just fine initially, the dock sizes with the content.
    But after collapsing and expanding the dock, the dock doesn't resize anymore!!!

    Is there any workaround?

  2. Danail Vasilev
    Danail Vasilev avatar
    1502 posts

    Posted 18 Jun 2013 Link to this post

    Hi Caesar,

    I have logged this issue in our feedback portal here, so that you can monitor, comment and vote on it. The unexpected behavior is related to the height that is set to the wrapper of the RadDock as well as to the wrapper of the content template, so that the browser cannot resize them. For the time being you can manually remove both heights on DockExpandCollapseCommand:
    <telerik:RadDock runat="server" ID="RadDock1" RenderMode="Classic" Resizable="true">
            <asp:Button ID="btn" runat="server" Text="Click me" OnClientClick="toggleVisibility(); return false;" />
            <div id="divExpand" style="display: none; height: 400px;">
            <telerik:DockExpandCollapseCommand OnClientCommand="DockExpandCollapseCommand" />
    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
        <script type="text/javascript">
            function toggleVisibility() {
                var divExpand = $get('divExpand');
                if ( == 'none') {
           = 'block';
                else {
           = 'none';
            function DockExpandCollapseCommand(sender, args) {
                if (!sender.get_collapsed()) {
                    sender.get_contentContainer().style.height = "";
                    sender.get_element().style.height = "";

    Danail Vasilev
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
Back to Top