Under Review
Last Updated: 12 Apr 2019 10:34 by ADMIN
Rathna
Created on: 05 Apr 2019 10:41
Category: UI for ASP.NET AJAX
Type: Feature Request
1
Automatically aligning the height of raddock control

Hi,

It will be great to have a property in a raddock to automatically adjust its height/width to occupy the new space created when some other raddock in the layout is minimized. This will avoid the need for the user to adjust the height/width of the raddock which is still visible.

 

1 comment
ADMIN
Rumen
Posted on: 12 Apr 2019 10:34
Hi Rathna,

Thank you for your feature request!

Setting Width and Height of the RadDock in percentage values is not supported, because of one main reason - in quite a lot of scenarios the Width and Height are computed dynamically, and are set to a fixed values in pixels. The scenarios involve: expanding and collapsing the dock, resizing the dock, dragging the dock in some specific cases.

So, if you still require Height in percents, you could enforce it using custom CSS, as shown in this code:

<%@ Register Namespace="Telerik.Web.UI.Debug" TagPrefix="debug" %>
<!DOCTYPE html>
 
<head runat="server">
    <title></title>
    <style type="text/css">
        .dock70
        {
            height: 70% !important;
        }
        .dock30
        {
            height: 30% !important;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <asp:ScriptManager ID="RadScriptManager1" runat="server">
    </asp:ScriptManager>
    <script type="text/javascript">
        //Put your JavaScript code here.
    </script>
    <div>
        <telerik:RadDockLayout ID="RadDockLayout1" runat="server">
            <telerik:RadDockZone ID="RadDockZone1" runat="server" Height="100%" Width="300px">
                <telerik:RadDock ID="RadDock1" runat="server" Title="RadDock-Title" Width="300px"
                    CssClass="dock70">
                    <ContentTemplate>
                        Dock's Content 70%
                    </ContentTemplate>
                </telerik:RadDock>
                <telerik:RadDock ID="RadDock2" runat="server" Title="RadDock-Title" Width="300px"
                    CssClass="dock30">
                    <ContentTemplate>
                        Dock's Content 30%
                    </ContentTemplate>
                </telerik:RadDock>
            </telerik:RadDockZone>
        </telerik:RadDockLayout>
    </div>
    </form>
</body>
</html>


Regards,
Rumen
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.