[Expand]General Information
[Expand]WinForms Controls
[Expand]ASP.NET Controls and MVC Extensions
[Expand]ASP.NET Bootstrap Controls
[Expand]ASP.NET Core Bootstrap Controls
[Expand]WPF Controls
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Office File API
[Expand]Report and Dashboard Server
[Collapse]eXpressApp Framework
 [Expand]Getting Started
 [Expand]Design-Time Features
 [Collapse]Task-Based Help
  [Expand]Business Model Design
  [Expand]Application Model
  [Expand]List Editors
  [Expand]Property Editors
  [Expand]Scheduler and Notifications
  [Collapse]Miscellaneous UI Customizations
    How to: Add a Button to a Detail View Using a Custom View Item
    How to: Add an XAF Mobile Custom Module
    How to: Adjust the Size and Style of Pop-up Dialogs (ASP.NET)
    How to: Adjust the Windows' Size and Style
    How to: Change an Application Logo and Info
    How to: Create a Custom Control Detail Item
    How to: Customize a Window Caption
    How to: Customize ASP.NET Layout Elements Using Custom CSS Classes
    How to: Customize Export Options of the Printing System
    How to: Customize the Conditional Appearance Module Behavior
    How to: Customize Window Status Messages (WinForms)
    How to: Enable High DPI Support in a WinForms Application
    How to: Implement a Custom Messaging Class
    How to: Implement Client-Side Logic in Mobile Applications
    How to: Include an Action to a Detail View Layout
    How to: Raise XAF Callbacks from Client-Side Events and Process these Callbacks on Server
    How to: Set Images and Captions for Enumeration Values
    How to: Show a Custom Window with an Embedded XAF View
    How to: Show a Custom Windows Form
    How to: Use a Custom Plugin in a Mobile Application
    How to: Use a Custom Splash Screen
    How to: Use a DevExtreme Chart in a Mobile Application
    How to: Use Custom Themes in ASP.NET Applications
  Frequently Asked Questions (FAQ)
 [Expand]API Reference
[Expand]eXpress Persistent Objects
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation
View this topic on docs.devexpress.com (Learn more)

How to: Adjust the Size and Style of Pop-up Dialogs (ASP.NET)

In ASP.NET XAF applications, pop-up dialog windows are displayed using the ASPxPopupControl. End-users can drag the size grip in the lower-right corner to resize a pop-up window if it is not restricted in settings. You can also customize the initial size in code. The size of the main window is equal to the browser window size. This topic describes how to resize and customize pop-up windows programmatically, depending on the View displayed.


A complete sample project is available in the DevExpress Code Examples database at http://www.devexpress.com/example=E4208.


A similar example for WinForms is available in the How to: Adjust the Windows' Size and Style topic.

Expanded Set the Default Size and Style of Pop-up Windows

To apply a unified style for all pop-up windows in the ASP.NET application with the new web UI, use the following recommended XafPopupWindowControl static properties.

Add the following code to the Application_Start method in the Global.asax.cs (Global.asax.vb) file.

If you customize pop-up windows in an ASP.NET application with the classic web UI, you can set the default height and width in the Model Editor using the IModelPopupWindowOptionsWeb.WindowHeight and IModelPopupWindowOptionsWeb.WindowWidth properties.

Expanded Set the Size and Style of Individual Popup Windows

The XafPopupWindowControl.CustomizePopupWindowSize event allows you to change the default popup window's parameters. For this purpose, create a Controller in the ASP.NET module project and subscribe to the PopupWindowManager.PopupShowing event to access the XafPopupWindowControl instance. Then, subscribe to the CustomizePopupWindowSize event and define the required size or style in the event handler.

The following example demonstrates how to change the default size of all popup windows:

Use the CustomizePopupWindowSizeEventArgs's CustomizePopupWindowSizeEventArgs.ShowPopupMode and CustomizePopupWindowSizeEventArgs.PopupTemplateType properties to change a popup window's style.

Note that in the New Web UI, you cannot manage the height and position of a popup window if its ShowPopupMode is set to Slide.

To access the ASPxPopupControl's properties, handle the XafPopupWindowControl.CustomizePopupControl event in the same manner.

Expanded Assess the View Displayed in the Pop-up Window and Set the Size Accordingly

To access the View displayed in a pop-up window, use the ShowViewSource.SourceView property. For instance, to adjust the size of the DemoTask type's pop-up windows, use the following code.

You can also use the BaseXafPage.View property to access the parent View (which is displayed behind the pop-up).

If it is necessary to customize a pop-up window invoked from a particular Frame and display an object of a specific type in it, use the CustomizePopupWindowSizeEventArgs.PopupFrame and CustomizePopupWindowSizeEventArgs.SourceFrame properties. The following example explains how to customize a pop-up window with the DemoTask object invoked from the window with the Contact object.

If your pop-up View is an embedded part of a reference property editor (ASPxLookupPropertyEditor or ASPxObjectPropertyEditor), it may be necessary to determine which lookup is the source for the pop-up window to be invoked. The following code snippet demonstrates how to determine the source lookup window. In this example, the Data property provides access to the editor action references.

Also, you can create the PopupWindowShowAction class instance to invoke pop-up windows with the particular View that is set in the handler's CustomizePopupWindowParamsEventArgs.View parameter. Refer to the PopupWindowShowAction class description to see the code example.


Certain form Templates (e.g., pop-up window templates with the CustomizePopupWindowSizeEventArgs.ShowPopupMode property set to ShowPopupMode.Centered) may have particular specifics.

  • Size may be calculated dynamically based on the content.
  • The window may have restrictions for resizing (the IsSizeable property).
  • The window may expand to occupy the whole space (the Maximized property).

If your custom size is ignored using the aforementioned method, you may want to research the source code for each required form template and adjust your default form settings accordingly.

Is this topic helpful?​​​​​​​