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

Collapse While Dragging

5 Answers 134 Views
Dock
This is a migrated thread and some comments may be shown as answers.
Shane_A2Z
Top achievements
Rank 1
Shane_A2Z asked on 12 Jul 2007, 01:34 PM
How do yopu collapse a Dock while dragging? 

5 Answers, 1 is accepted

Sort by
0
Petio Petkov
Telerik team
answered on 12 Jul 2007, 03:53 PM
Hi Shane,

The following simple source code illustrates how to collapse RadDock while dragging it. To achieve this goal you have to handle the OnClientDragStart and OnClientDragEnd events of the RadDock object, and Collapse or Expand the RadDock.

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="pages_Dock_Tickets_CollapseDockWhileDrag_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 runat="server">  
    <title>Untitled Page</title> 
    <script type="text/javascript">  
         function OnClientDragStart(dock,args)  
         {  
                dock.set_Collapsed(true);  
         }  
         function OnClientDragEnd(dock,args)  
         {  
                dock.set_Collapsed(false);  
         }  
    </script> 
</head> 
<body> 
    <form id="form1" runat="server">  
      <asp:ScriptManager ID="ScriptManager1" runat="server">  
        </asp:ScriptManager> 
    <div> 
     
     <telerik:RadDockLayout ID="RadDockLayout1" runat="server">  
    <telerik:RadDockZone ID="RadDockZone1" runat="server" > 
    </telerik:RadDockZone>   
                    
            <telerik:RadDock ID="RadDock1" runat="server" Title="RadDock1"   
            Width="200px" Height="200px" 
            OnClientDragStart="OnClientDragStart" 
            OnClientDragEnd="OnClientDragEnd" 
            >                             
                <ContentTemplate> 
                  FLY !!!  
                </ContentTemplate>                                   
            </telerik:RadDock>   
      
                      
                </telerik:RadDockLayout> 
    </div> 
    </form> 
</body> 
</html> 
 

If you have any other questions please let us know!

All the best,
Petio Petkov
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center
0
Chris
Top achievements
Rank 1
answered on 26 Jul 2007, 08:33 PM
Telerik,

When I implemented this recommendation, it works great - collapsing on the drag and expanding on the drop - but only if I actually reorder the docks. If I just click the dock and then let up on the mouse, the dock will stay collapsed.

In my case, I've dynamically loaded the docks assigning each dock the OnClientDragStart and OnClientDragEnd functions. Autopostback is also enabled for each dock and a simple mouse click and release DOES trigger a postback (or in my case, a callback). Why would only the dock I clicked on collapse after the postback and why not any of the other docks? The docks are reloaded into my one DockZone on each postback in Page_Init. I checked and the postback correctly reloads the dock with .collapsed = false on the server side.

Any ideas how I can stop the dock from collapsing if I just click the dock and don't actually move it?

Thanks,
Chris
0
Petio Petkov
Telerik team
answered on 27 Jul 2007, 12:53 PM
Hi Chris,

I made some small changes in the code from the previous post. Now it will works when the RadDock is with AutoPostBack = true.
<%@ 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 runat="server">  
    <title>Untitled Page</title> 
    <script type="text/javascript">  
         function OnClientDragStart(dock,args)  
         {  
                dock.set_Collapsed(true);  
                dock.updateClientState();  
         }  
         function OnClientDragEnd(dock,args)  
         {  
                dock.set_Collapsed(false);  
                dock.updateClientState();                  
         }  
    </script> 
</head> 
<body> 
    <form id="form1" runat="server">  
      <asp:ScriptManager ID="ScriptManager1" runat="server">  
        </asp:ScriptManager> 
    <div> 
     
     <telerik:RadDockLayout ID="RadDockLayout1" runat="server">  
    <telerik:RadDockZone ID="RadDockZone1" runat="server" > 
    </telerik:RadDockZone>   
                    
            <telerik:RadDock ID="RadDock1" runat="server" Title="RadDock1"  AutoPostBack="true" 
            Width="200px" Height="200px" 
            OnClientDragStart="OnClientDragStart" 
            OnClientDockPositionChanged="OnClientDragEnd"              
            >                             
                <ContentTemplate> 
                  FLY !!!  
                </ContentTemplate>                                   
            </telerik:RadDock>   
      
                      
                </telerik:RadDockLayout> 
    </div> 
    </form> 
</body> 
</html> 
 


I hope that it will help you.

Greetings,
Petio Petkov
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center
0
Chris
Top achievements
Rank 1
answered on 04 Aug 2007, 02:08 PM
Petio,

I believe you misunderstood my question. I dynamically load docks directly into one RadDockZone. I already set the dock's .autopostback=true property when I load them on Page_INIT.

What I'm seeing though, is that when I click on the dock handle and then simply drop the dock in place, it will correctly post back, it will correctly NOT trigger the dock_positionChanged, but after I've reloaded/refreshed the dynamically loaded docks and post back to the web browser (all within an UpdatePanel), that dock panel is minimized - or actually it's empty, NOT minimized as the minimize icon is in the 'expanded' position. All of the other docks are still expanded and still have their content loaded within them.

So to summarize, what's causing the dock that I drag but drop back in it's same place to postback only to return with that dock now empty and all the others still correctly contain their data? I should mention, that if I actually drag and drop to a different location, all docks are correctly repositioned and refreshed.

At this point, I'm not sure if it's a quirky way I'm loading the docks dynamically or if it's a Dock problem. I'll continue to experiment on my end.

Thanks,
Chris
0
Petio Petkov
Telerik team
answered on 07 Aug 2007, 07:01 AM
Hello Chris,

I am afraid we are still not sure what exactly is your requirement. To ensure a quick resolution to your problem,  it will be best to open a new support ticket and send us a sample, running project which reproduces the behavior that you experience. Please send us detailed reproductions steps and a short description of the desired behavior as well. Once we have a better view over your case, we will do our best to help.



All the best,
Petio Petkov
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center
Tags
Dock
Asked by
Shane_A2Z
Top achievements
Rank 1
Answers by
Petio Petkov
Telerik team
Chris
Top achievements
Rank 1
Share this question
or