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

Dock place holder problem

4 Answers 72 Views
Dock
This is a migrated thread and some comments may be shown as answers.
Ivan
Top achievements
Rank 1
Ivan asked on 26 May 2009, 02:38 PM
Hello,
I have the following problem - I have a dock zone with docks that have to be dragged to another zone, but they cannot be dragged back on the first zone. I use the ForbiddenZones property of the docks. After beginning dragging the dock the place holder for dropping the dock appears. The problem is that after I drop the dock on the first zone the place holder does not hide.
Here is the code of the markup:

<telerik:RadDockZone ID="RadDockZone1" runat="server" UniqueName="RadDockZone1"
    <telerik:RadDock ID="RadDock1" runat="server" Text="RadDock1" ForbiddenZones="RadDockZone1" DockMode="Docked"
    </telerik:RadDock> 
    <telerik:RadDock ID="RadDock2" runat="server" Text="RadDock2" ForbiddenZones="RadDockZone1" DockMode="Docked"
    </telerik:RadDock> 
    <telerik:RadDock ID="RadDock3" runat="server" Text="RadDock3" ForbiddenZones="RadDockZone1" DockMode="Docked"
    </telerik:RadDock> 
</telerik:RadDockZone> 
<telerik:RadDockZone ID="RadDockZone2" runat="server" UniqueName="RadDockZone2"
</telerik:RadDockZone> 

I'm not sure if I'm clear enough with my description :) Thanks in advance.
Best regards,
Ivan Pelovski

4 Answers, 1 is accepted

Sort by
0
Obi-Wan Kenobi
Top achievements
Rank 1
answered on 26 May 2009, 03:28 PM

This is a normal behavior because you add a RadDock on the server in a frobidden RadDockZone :)
You should set _forbiddenZones via JavaSciript once you start to drag a RadDock,e.g.

<%@ 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></title>  
    <script type="text/javascript">  
        function DockDragStart(dock, args) {  
            if (!dock._forbiddenZones[0]) {  
                //hide placeholder  
                dock.get_dockZone()._hidePlaceholder();  
                //set forbidden zone to RadDockZone1  
                dock._forbiddenZones = new Array();  
                dock._forbiddenZones[0] = "RadDockZone1";  
 
            }  
              
        }  
    </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" UniqueName="RadDockZone1">    
                <telerik:RadDock ID="RadDock1" runat="server" Text="RadDock1" DockMode="Docked" OnClientDragStart="DockDragStart">    
                </telerik:RadDock>    
                <telerik:RadDock ID="RadDock2" runat="server" Text="RadDock2" DockMode="Docked" OnClientDragStart="DockDragStart">    
                </telerik:RadDock>    
                <telerik:RadDock ID="RadDock3" runat="server" Text="RadDock3" DockMode="Docked" OnClientDragStart="DockDragStart">    
                </telerik:RadDock>    
            </telerik:RadDockZone>    
            <telerik:RadDockZone ID="RadDockZone2" runat="server" UniqueName="RadDockZone2">    
            </telerik:RadDockZone> 
        </telerik:RadDockLayout> 
    </div> 
    </form> 
</body> 
</html> 

0
Ivan
Top achievements
Rank 1
answered on 26 May 2009, 03:53 PM
Thanks for the reply Obi-Wan Kenobi. But your suggestion doesn't work neither. Start dragging one of the docks and then drop it on the first zone. Till now the code works well. Start dragging the same dock again. The place holder appears maybe because the dock now has its ForbiddenZones property set.


0
Obi-Wan Kenobi
Top achievements
Rank 1
answered on 27 May 2009, 12:54 PM

The code works if you dock a RadDock to RadDockZone2. I updated the code and it should work in both cases now.

<%@ 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></title>     
    <script type="text/javascript">     
        function DockDragStart(dock, args) {     
            if (!dock._forbiddenZones[0]) {     
                //hide placeholder     
                dock.get_dockZone()._hidePlaceholder();     
                //set forbidden zone to RadDockZone1     
                dock._forbiddenZones = new Array();     
                dock._forbiddenZones[0] = "RadDockZone1";     
    
            }  
 
        }  
        function DockDragEnd(dock, args) {  
            if (dock.get_dockZoneID() == "RadDockZone1") {  
                $find("RadDockZone2").dock(dock);  
            }  
        }   
    </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" UniqueName="RadDockZone1">       
                <telerik:RadDock ID="RadDock1" runat="server" Text="RadDock1" DockMode="Docked"   
                 OnClientDragStart="DockDragStart" 
                 OnClientDragEnd="DockDragEnd">       
                </telerik:RadDock>       
                <telerik:RadDock ID="RadDock2" runat="server" Text="RadDock2" DockMode="Docked"   
                OnClientDragStart="DockDragStart" 
                OnClientDragEnd="DockDragEnd">       
                </telerik:RadDock>       
                <telerik:RadDock ID="RadDock3" runat="server" Text="RadDock3" DockMode="Docked"   
                OnClientDragStart="DockDragStart" 
                OnClientDragEnd="DockDragEnd">       
                </telerik:RadDock>       
            </telerik:RadDockZone>       
            <telerik:RadDockZone ID="RadDockZone2" runat="server" UniqueName="RadDockZone2">       
            </telerik:RadDockZone>    
        </telerik:RadDockLayout>    
    </div>    
    </form>    
</body>    
</html>    
 
0
Ivan
Top achievements
Rank 1
answered on 27 May 2009, 01:41 PM
Thanks again for your replies Obi-Wan :) But this is not the desired behavior for the docks. They should remain in the first zone if dropped there on their initial places. A college of mine came to a workaround of the problem but I think this is a bug of the dock zone and it should be addressed like that.
To help others here is the code of the workaround:
<script> 
    function DockRelocated(dock, args) { 
        if (dock._hitZone.get_uniqueName() == 'RadDockZone1') { 
            args.set_cancel(true); 
        } 
    } 
</script> 
     
<telerik:RadDockZone ID="RadDockZone1" runat="server" UniqueName="RadDockZone1"
    <telerik:RadDock ID="RadDock1" runat="server" Text="RadDock1" DockMode="Docked" OnClientDockPositionChanging="DockRelocated"
    </telerik:RadDock> 
    <telerik:RadDock ID="RadDock2" runat="server" Text="RadDock2" DockMode="Docked" OnClientDockPositionChanging="DockRelocated"
    </telerik:RadDock> 
    <telerik:RadDock ID="RadDock3" runat="server" Text="RadDock3" DockMode="Docked" OnClientDockPositionChanging="DockRelocated"
    </telerik:RadDock> 
</telerik:RadDockZone> 
<telerik:RadDockZone ID="RadDockZone2" runat="server" UniqueName="RadDockZone2"
</telerik:RadDockZone> 

Best regards,
Ivan Pelovski
Tags
Dock
Asked by
Ivan
Top achievements
Rank 1
Answers by
Obi-Wan Kenobi
Top achievements
Rank 1
Ivan
Top achievements
Rank 1
Share this question
or