Panel Overview

• Jun 16, 2022
• 3 minutes to read

The dock panel is a content placeholder that users can move between dock zones on a web page.

Use the ASPxPopupControlBase.DragElement property to specify which part of a panel users can drag to move it. To prohibit users from dragging a panel, set the ASPxDockPanel.AllowDragging property to false.

ASPxDockPanel allows users to resize a panel if the ASPxPopupControlBase.AllowResize property is set to true. To specify the size constraints for a panel, use the ASPxPopupControlBase.MinHeight, ASPxPopupControlBase.MaxHeight, ASPxPopupControlBase.MinWidth, and ASPxPopupControlBase.MaxWidth properties. If the panel content does not fit the panel size, you can use the ASPxPopupControlBase.ScrollBars property to enable scroll bars.

Note

You cannot change the ASPxDockPanel size if it is docked. As a workaround, undock the panel (the MakeFloat method), change its size, and dock it back to the dock zone (the Dock(zone) method).

JS

var zone = pnl1.GetOwnerZone();
pnl1.MakeFloat();
... // Change the panel's size
pnl1.Dock(zone);

You can use a panel’s ASPxDockPanel.PanelUID property to set/get the panel’s unique identifier. Use this unique identifier to obtain a panel on the server (ASPxDockManager.FindPanelByUID) or client (ASPxClientDockManager.GetPanelByUID and ASPxClientDockZone.GetPanelByUID) side.

You can use callbacks to load ASPxDockPanel content on demand. The ASPxDockPanel.LoadContentViaCallback property allows you to specify the loading mode of the panel content.

A dock panel can either be docked to a dock zone or made to float. Users can drag panels to dock/undock them. To change the panel dock state, use one of the following techniques:

• Server side: use the ASPxDockPanel.OwnerZone or ASPxDockPanel.OwnerZoneUID property.

• Client side: use the ASPxClientDockPanel.Dock and ASPxClientDockPanel.MakeFloat methods.

To get the panel dock state on the client side use the ASPxClientDockPanel.IsDocked method. Use the ASPxClientDockPanel.IsDocked method to get the panel dock state on the client side.

You can use the ASPxDockPanel.OwnerZone property to get the zone to which the panel belongs. Use the ASPxDockPanel.OwnerZoneUID property to access the ID of this zone. To get the zone, use the ASPxClientDockPanel.GetOwnerZone method. You can use the ASPxDockPanel.VisibleIndex property to control where the panel is displayed amongst other panels within the zone. To manage a panel’s visible index on the client side, use the ASPxClientDockPanel.GetVisibleIndex and ASPxClientDockPanel.SetVisibleIndex methods.

Use a dock panel’s ASPxDockPanel.ForbiddenZones property to specify disallowed zones for the panel - the zones to which the panel cannot be docked. To learn more about forbidden zones, see the following help topic: Forbidden Zones.

You can use corresponding panel events to respond to panel drag and dock actions. Additionally, you can use dock manager events to respond to panel close, show, and resize actions. See the following topic to learn more: Common Docking Events.

Reasons a panel may not dock

A panel does not dock to a zone in the following cases:

• the ASPxDockManager.FreezeLayout property is set to true;
• the zone is contained within the panel’s ASPxDockPanel.ForbiddenZones collection;
• the ASPxDockPanel.AllowedDockState property is set to FloatOnly;
• the ASPxDockZone.AllowGrowing property is set to false and the free space within the zone is smaller than the dock panel size.

Note

Although you can set the zone to which the panel belongs programmatically, it actually stays in a floating state.