Tab

ASPxDockZone Class

A zone where panels can be docked.

Namespace: DevExpress.Web

Assembly: DevExpress.Web.v21.2.dll

Declaration

public class ASPxDockZone :
    ASPxWebControl

Remarks

The ASPxDockZone class specifies a zone where panels can be docked. A collection of docked panels can be accessed via the ASPxDockZone.Panels property. A panel is docked to a zone if the panel’s ASPxDockPanel.OwnerZoneUID property is set to the zone’s ASPxDockZone.ZoneUID property value.

Use the ASPxDockZone.ZoneUID property to specify a zone’s unique identifier. This property can be used to obtain a zone at runtime on the server (ASPxDockManager.FindZoneByUID) or client (ASPxClientDockManager.GetZoneByUID) side.

Docking_Zone

Create a DockZone Control

Design Time

The ASPxDockZone control is available on the DX.21.2: Navigation & Layout toolbox tab in the Microsoft Visual Studio IDE.

Drag the control onto a form and customize the control’s settings, or paste the control’s markup in the page’s source code.

<dx:ASPxDockZone runat="server" ID="dockZone" ZoneUID="DockZone" Height="220px" Width="250px" />

<dx:ASPxDockPanel runat="server" ID="dockPanel" OwnerZoneUID="DockZone"...>
    <!--...-->        
</dx:ASPxDockPanel>

Run Time

using DevExpress.Web;
...
protected void Page_Load(object sender, EventArgs e)
{
    ASPxDockZone dockZone = new ASPxDockZone();
    dockZone.ID = "dockZone";
    Page.Form.Controls.Add(dockZone);

    dockZone.Height = 220;
    dockZone.Width = 250;
    dockZone.ZoneUID = "DockZone";

    ASPxDockPanel dockPanel = new ASPxDockPanel();
    dockPanel.ID = "dockPanel";
    Page.Form.Controls.Add(dockPanel);

    dockPanel.OwnerZoneUID = "DockZone";
    // ...
}

Note

DevExpress controls require that you register special modules, handlers, and options in the Web.config file. You can change this file or switch to the Design tab in the Microsoft Visual Studio IDE to automatically update the Web.config file. Note that this information is automatically registered if you use the DevExpress Template Gallery to create a project.

Panels can be arranged within a zone control, one after another, either vertically or horizontally. Use the zone’s ASPxDockZone.Orientation property to control the arrangement of panels within a zone.

An ASPxDockZone control can enlarge its size (Height for a vertically oriented zone and Width for a horizontally oriented zone) to contain a docking panel. To control a zone’s ability to grow, use the ASPxDockZone.AllowGrowing property.

You can provide different appearances for the allowed and forbidden zone states by using a dock zone’s DockZoneStyles.DockingAllowedStyle and DockZoneStyles.DockingForbiddenStyle properties. These appearances are used to highlight zones during panel dragging, and to indicate whether a particular zone is allowed or disallowed from panel docking. You can specify the appearance of a zone section where the panel can be docked, via the DockZoneStyles.PanelPlaceholder property.

Note

The ASPxDockZone control provides you with comprehensive client-side functionality, implemented using JavaScript code:

The control’s client-side API is enabled if the ASPxDockZone.ClientInstanceName property is defined, or any client event is handled.

See Also