Log In
Home
Support
Demos
Documentation
Blogs
Training
Webinars
[Expand]General Information
[Expand]WinForms Controls
[Collapse]ASP.NET Controls and MVC Extensions
 [Expand]Prerequisites
 [Expand]What's Installed
 [Expand]Common Concepts
 [Expand]ASP.NET WebForms Controls
 [Collapse]ASP.NET MVC Extensions
  [Expand]Product Information
  [Expand]Getting Started
  [Expand]Common Concepts
  [Expand]Grid View
  [Expand]Card View
  [Expand]Vertical Grid
  [Expand]Spreadsheet
  [Expand]Rich Text Editor
  [Expand]HTML Editor
  [Expand]Image and Data Browsing
  [Collapse]Docking and Popups
   [Collapse]Docking
     Overview - Docking
    [Expand]Concepts
    [Expand]Visual Elements
   [Expand]Loading Panel
   [Expand]Hint
   [Expand]PopupControl
  [Expand]Navigation and Layout Extensions
  [Expand]File Management
  [Expand]Multi-Use Site Extensions
  [Expand]Charts
  [Expand]Pivot Grid
  [Expand]Scheduler
  [Expand]Tree List
  [Expand]Data Editor Extensions
  [Expand]Report Extensions
  [Expand]SpellChecker
 [Expand]Localization
 [Expand]Redistribution and Deployment
  Get More Help
 [Expand]API Reference
[Expand]ASP.NET Bootstrap Controls
[Expand]WPF Controls
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Document Server
[Expand]Reporting
[Expand]Report Server
[Expand]Dashboard
[Expand]eXpressApp Framework
[Expand]CodeRush
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation

Overview - Docking

The DevExpress MVC extensions contain three dockable components: DockPanel, DockZone and DockManager. They allow you to manage content placeholders (dock panels), which can be moved by end-users between particular areas (dock zones) within a web page. A dock panel can either be docked to a dock zone or made to float. Dock zones can be placed at any part of a page; their orientation and size are fully customizable. Dock manager allows you to provide a centralized programmatic control of all dock panels and dock zones contained within a page.

To learn more about dockable extensions and see them in action, refer to its online demos.

Expanded Implementation Details

DockPanel is realized by the DockPanelExtension class. Its instance can be accessed via the ExtensionsFactory.DockPanel helper method, which is used to add a DockPanel extension to a view. This method's parameter provides access to the DockPanel's settings implemented by the DockPanelSettings class, allowing you to fully customize the extension. DockPanel's client counterpart is represented by the MVCxClientDockPanel object.

DockZone is realized by the DockZoneExtension class. Its instance can be accessed via the ExtensionsFactory.DockZone helper method, which is used to add a DockZone extension to a view. This method's parameter provides access to the DockZone's settings implemented by the DockZoneSettings class, allowing you to fully customize the extension. DockZone's client counterpart is represented by the ASPxClientDockZone object.

DockManager is realized by the DockManagerExtension class. Its instance can be accessed via the ExtensionsFactory.DockManager helper method, which is used to add a DockManager extension to a view. This method's parameter provides access to the DockManager's settings implemented by the DockManagerSettings class, allowing you to fully customize the extension. DockManager's client counterpart is represented by the MVCxClientDockManager object.

Expanded Declaration

Docking extensions can be added to a view in the following manner.

View code (Razor):

How would you rate this topic?​​​​​​​