Skip to main content

ASPxPopupControl.Modal Property

Specifies whether the default popup window is modal.

Namespace: DevExpress.Web

Assembly: DevExpress.Web.v23.2.dll

NuGet Package: DevExpress.Web


public bool Modal { get; set; }

Property Value

Type Default Description
Boolean false

true if the window is modal; otherwise, false.


A modal pop-up window retains input focus while open. A user cannot switch windows until the pop-up window is closed.

When the Modal property is set to true, make sure that the CloseAction property is set to the CloseButton value to prevent the pop-up window from being closed by clicking the mouse mouse outside the window (the default closing action).

When adaptive mode is enabled, the Modal property is not in effect and the window is displayed in modal mode.


This example demonstrates how nested popup windows can be displayed using the ASPxPopupControl.

function KeyHandler(e) {
        if (e.keyCode == 27)
            if (window2.IsVisible())
            else if (window1.IsVisible())
                return false;
        return true;
<head id="Head1" runat="server">
    <title>Nested modal windows</title> 
<body id="body" onkeydown="return KeyHandler(event);">
    <form id="form1" runat="server">
        <dx:ASPxPopupControl ID="window1" runat="server" Modal="true" HeaderText="First Window" 
PopupElementID="body" ClientInstanceName="window1" CloseAction="CloseButton" PopupAction="None" 
PopupHorizontalAlign="WindowCenter" PopupVerticalAlign="WindowCenter" AllowDragging="True">
                <dx:PopupControlContentControl runat="server">
                    <dx:ASPxButtonEdit ID="ASPxButtonEdit1" runat="server" 
                        Text="Click Ellipsis Button to open Second Modal Window">
                        <ClientSideEvents ButtonClick="function(s, e) {
                        }" />
        </dx:ASPxPopupControl><dx:ASPxPopupControl ID="window2" runat="server" Modal="true" 
            HeaderText="Second Window" PopupElementID="ASPxButtonEdit1" 
            CloseAction="CloseButton" PopupAction="None" PopupHorizontalAlign="WindowCenter" 
            PopupVerticalAlign="WindowCenter" AllowDragging="True">
                    <dx:ASPxDateEdit ID="ASPxDateEdit1" runat="server">
                    <dx:ASPxButton ID="ASPxButton2" runat="server" AutoPostBack="False" 
                    Text="Close" >
                        <ClientSideEvents Click="function(s, e) {
                        }" />
        <dx:ASPxButton ID="ASPxButton1" runat="server" AutoPostBack="False" 
            Text="Open First Window">
            <ClientSideEvents Click="function(s, e) {
            }" />

The following code snippet (auto-collected from DevExpress Examples) contains a reference to the Modal property.


The algorithm used to collect these code examples remains a work in progress. Accordingly, the links and snippets below may produce inaccurate results. If you encounter an issue with code examples below, please use the feedback form on this page to report the issue.

See Also