
barry babister
Top achievements
Rank 1
barry babister
asked on 27 Oct 2008, 11:06 AM
Is there a way that you can show content after the dock has been Collapsed ?
3 Answers, 1 is accepted
0

Obi-Wan Kenobi
Top achievements
Rank 1
answered on 27 Oct 2008, 03:43 PM
Try to expand it.
Collapse comand is toggle command and it contains two commands- collapse and expand.
Try pressing the collapse command two times here:
http://demos.telerik.com/ASPNET/Prometheus/Dock/Examples/AutoPostBack/DefaultCS.aspx
Collapse comand is toggle command and it contains two commands- collapse and expand.
Try pressing the collapse command two times here:
http://demos.telerik.com/ASPNET/Prometheus/Dock/Examples/AutoPostBack/DefaultCS.aspx
0

barry babister
Top achievements
Rank 1
answered on 27 Oct 2008, 04:26 PM
No , i want to collapase the docker , but i want to display a smaller version of the content that is in the docker
So when they are expanded they show all the content and when they are collapsed they show a smaller version of the content
So when they are expanded they show all the content and when they are collapsed they show a smaller version of the content
0

Obi-Wan Kenobi
Top achievements
Rank 1
answered on 28 Oct 2008, 10:07 AM
The code below illustrates your goal
<%@ Register assembly="Telerik.Web.UI" namespace="Telerik.Web.UI" tagprefix="telerik" %> |
<!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 runat="server"> |
<title>Untitled Page</title> |
<script type="text/javascript"> |
function ToggleDock(dock,args) |
{ |
var smallDiv = $get("RadDock1_Small"); |
var bigDiv = $get("RadDock1_Big"); |
if(smallDiv.style.display == "none") |
{ |
smallDiv.style.display = ""; |
bigDiv.style.display="none"; |
} |
else |
{ |
smallDiv.style.display = "none"; |
bigDiv.style.display=""; |
} |
} |
</script> |
</head> |
<body> |
<form id="form1" runat="server"> |
<asp:ScriptManager id="ScriptManager1" runat="server"/> |
<telerik:RadDockLayout ID="RadDockLayout1" runat="server"> |
<telerik:RadDock ID="RadDock1" runat="server"> |
<Commands> |
<telerik:DockCommand Name="custom" OnClientCommand="ToggleDock" /> |
</Commands> |
<ContentTemplate> |
<div id="RadDock1_Small" style="display:none"> |
small text |
</div> |
<div id="RadDock1_Big"> |
BIG TEXT<br /> |
BIG TEXT<br /> |
BIG TEXT<br /> |
BIG TEXT<br /> |
BIG TEXT<br /> |
BIG TEXT<br /> |
BIG TEXT<br /> |
BIG TEXT<br /> |
BIG TEXT<br /> |
BIG TEXT<br /> |
BIG TEXT<br /> |
</div> |
</ContentTemplate> |
</telerik:RadDock> |
</telerik:RadDockLayout> |
</form> |
</body> |
</html> |
I added two divs in the RadDock(one is with display:none).When a custom command is clicked the smallDiv is showed and apply display:none to the bigDiv.
A simple example with custom commands is available here:
http://demos.telerik.com/ASPNET/Prometheus/Dock/Examples/Commands/DefaultCS.aspx