This is a migrated thread and some comments may be shown as answers.

Displaying Content after Docker Collapse

3 Answers 68 Views
Dock
This is a migrated thread and some comments may be shown as answers.
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

Sort by
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
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


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
Tags
Dock
Asked by
barry babister
Top achievements
Rank 1
Answers by
Obi-Wan Kenobi
Top achievements
Rank 1
barry babister
Top achievements
Rank 1
Share this question
or