I'm not sure this can be done but figured I would post the question.
For our application, we have a multi-dashboard solution with each dashboard having a set of floating docks (due to various sizes, etc). This works well for most cases but recently we have had customers creating dashboards for 1920 x 1080 monitors. This would be fine if all user machines were 1920x1080 but with the use of tablets, laptops and various PCs this cannot be done. So what I would like to do is create a display palette (zone) of 1920x1080 that would allow you to place floating docks on it. Then on a small monitor, it would provide you scrollbars on the zone but on the full size 1920x1080 monitor it wouldn't. Obviously this would work if we had docked controls but unfortunetly there are way to many control sizing factors preventing this.
Has anyone done something like this or have suggestions on how this can be achieved. Minimally I would be happy if a user with a low resolution monitor would at least get scrolls for a larger designed dashboard.
I looked at the restricted zone example. Here is an example and you notice the scroll doesn't work on the middle splitter section in association to the docks:
Thanks in advanced,
Shane
For our application, we have a multi-dashboard solution with each dashboard having a set of floating docks (due to various sizes, etc). This works well for most cases but recently we have had customers creating dashboards for 1920 x 1080 monitors. This would be fine if all user machines were 1920x1080 but with the use of tablets, laptops and various PCs this cannot be done. So what I would like to do is create a display palette (zone) of 1920x1080 that would allow you to place floating docks on it. Then on a small monitor, it would provide you scrollbars on the zone but on the full size 1920x1080 monitor it wouldn't. Obviously this would work if we had docked controls but unfortunetly there are way to many control sizing factors preventing this.
Has anyone done something like this or have suggestions on how this can be achieved. Minimally I would be happy if a user with a low resolution monitor would at least get scrolls for a larger designed dashboard.
I looked at the restricted zone example. Here is an example and you notice the scroll doesn't work on the middle splitter section in association to the docks:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %><%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" ><head id="Head1" runat="server"> <title>Test</title> <style type="text/css"> html, body, form { height:100%; margin:0px; padding:0px; overflow:hidden; } </style></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager> <telerik:RadSplitter ID="RadSplitter1" runat="server" Height="100%" Width="100%" Orientation="Horizontal"> <telerik:RadPane ID="RadPane1" runat="server" Height="50" BackColor="Red"> Top Pane </telerik:RadPane> <telerik:RadPane ID="RadPane2" runat="server" BackColor="Red"> <div id="restrictionZone" style="border: solid 1px black; background-color:Green; width: 600px; height: 1200px;"> Docks are only allowed here<br /> <telerik:RadDockLayout ID="RadDockLayout1" runat="server"> <telerik:RadDock ID="RadDock1" runat="server" Width="300px" OnClientDragEnd="OnClientDragEnd" Resizable="true" Top="55" Height="200"> </telerik:RadDock> </telerik:RadDockLayout> </div> </telerik:RadPane> <telerik:RadPane ID="RadPane3" runat="server" Height="50" BackColor="Red"> Footer Pane </telerik:RadPane> </telerik:RadSplitter> </form> <script type="text/javascript"> var restrictionZone = $get('restrictionZone'); function OnClientDragEnd(dock) { var restrBounds = $telerik.getBounds(restrictionZone); var dockBounds = $telerik.getBounds(dock.get_element()); var inBounds = Telerik.Web.UI.ResizeExtender.containsBounds(restrBounds, dockBounds); if (!inBounds) { if (dockBounds.x < restrBounds.x) { dock.set_left(restrBounds.x); } else if (restrBounds.x + restrBounds.width < dockBounds.x + dockBounds.width) { dock.set_left(restrBounds.x + restrBounds.width - dockBounds.width); } if (dockBounds.y < restrBounds.y) { dock.set_top(restrBounds.y); } else if (restrBounds.y + restrBounds.height < dockBounds.y + dockBounds.height) { dock.set_top(restrBounds.y + restrBounds.height - dockBounds.height); } } } </script></body></html>Thanks in advanced,
Shane
1 Answer, 1 is accepted
0
Hi Shane,
Note that a floating RadDock control is not a child of the RadPane, but of the page's body section and as such it will not be scrolled with the content of the pane control. To ensure that the RadDock will be a part of the RadPane's content and the scrollbar will affect it as well, I would suggest specifying a separate page as the content of the middle RadPane. You can find a sample project that demonstrates this setup.
The RadWindow control has a built-in Restricted Zones functionality so you may consider using it instead, as it appears you are not utilizing the docking feature of RadDock. Nevertheless, if you want to persist the layout of the draggable sections through postback, you should stick to RadDock.
Feel free to contact us again if you encounter more difficulties.
Greetings,
Slav
the Telerik team
Note that a floating RadDock control is not a child of the RadPane, but of the page's body section and as such it will not be scrolled with the content of the pane control. To ensure that the RadDock will be a part of the RadPane's content and the scrollbar will affect it as well, I would suggest specifying a separate page as the content of the middle RadPane. You can find a sample project that demonstrates this setup.
The RadWindow control has a built-in Restricted Zones functionality so you may consider using it instead, as it appears you are not utilizing the docking feature of RadDock. Nevertheless, if you want to persist the layout of the draggable sections through postback, you should stick to RadDock.
Feel free to contact us again if you encounter more difficulties.
Greetings,
Slav
the Telerik team
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 their blog feed now.