ASPxPopupControl.Modal Property
Gets or sets whether the default popup window is modal.
Namespace: DevExpress.Web
Assembly: DevExpress.Web.v19.2.dll
Declaration
Property Value
| Type | Default | Description |
|---|---|---|
| Boolean | **false** | true if the default popup window is modal; otherwise, false. |
Remarks
A modal popup window retains input focus while open. The user cannot switch windows until the popup window is closed.
Note
When enabling the modal mode, make sure that the ASPxPopupControl.CloseAction property is set properly. It’s necessary to set the ASPxPopupControl.CloseAction property to the CloseAction.CloseButton value, to prevent the popup window from being closed by an outer mouse click (which is a closing action set by default).
Example
This example demonstrates how nested popup windows can be displayed using the ASPxPopupControl.
function KeyHandler(e) {
if (e.keyCode == 27)
if (window2.IsVisible())
window2.Hide();
else if (window1.IsVisible())
window1.Hide();
else
return false;
return true;
}
<head id="Head1" runat="server">
<title>Nested modal windows</title>
</head>
<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">
<ContentCollection>
<dx:PopupControlContentControl runat="server">
<dx:ASPxButtonEdit ID="ASPxButtonEdit1" runat="server"
Text="Click Ellipsis Button to open Second Modal Window">
<Buttons>
<dx:EditButton></dx:EditButton>
</Buttons>
<ClientSideEvents ButtonClick="function(s, e) {
window2.Show();
}" />
</dx:ASPxButtonEdit>
</dx:PopupControlContentControl>
</ContentCollection>
</dx:ASPxPopupControl><dx:ASPxPopupControl ID="window2" runat="server" Modal="true"
HeaderText="Second Window" PopupElementID="ASPxButtonEdit1"
ClientInstanceName="window2"
CloseAction="CloseButton" PopupAction="None" PopupHorizontalAlign="WindowCenter"
PopupVerticalAlign="WindowCenter" AllowDragging="True">
<ContentCollection>
<dx:PopupControlContentControl>
<dx:ASPxDateEdit ID="ASPxDateEdit1" runat="server">
</dx:ASPxDateEdit>
<dx:ASPxButton ID="ASPxButton2" runat="server" AutoPostBack="False"
Text="Close" >
<ClientSideEvents Click="function(s, e) {
window2.Hide();
}" />
</dx:ASPxButton>
</dx:PopupControlContentControl>
</ContentCollection>
</dx:ASPxPopupControl>
<br/>
<dx:ASPxButton ID="ASPxButton1" runat="server" AutoPostBack="False"
Text="Open First Window">
<ClientSideEvents Click="function(s, e) {
window1.Show();
}" />
</dx:ASPxButton>
</form>
</body>
See Also