DxPopupBase.CloseOnEscape Property

Specifies whether the Popup should be closed when a user presses Escape.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.1.dll

NuGet Package: DevExpress.Blazor

Declaration

[DefaultValue(true)]
[Parameter]
public bool CloseOnEscape { get; set; }

Property Value

Type	Default	Description
Boolean	true	true if the Popup should be closed when a user presses Escape; otherwise; false

Remarks

Users can close the Popup in the following ways:

• Click the Close button in the header.
• Click outside the Popup’s boundaries.
• Press Escape.

Set the CloseOnEscape property to false to not close the Popup in response to Escape keystroke. The ShowCloseButton and CloseOnOutsideClick properties allow you to disable other user capabilities.

<div @onclick="@(() => PopupVisible = true)">
    <p>CLICK TO SHOW A POP-UP WINDOW</p>
</div>

<DxPopup @bind-Visible="@PopupVisible"
         HeaderText="Header"
         BodyText="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sit amet metus vel
             nisi blandit tincidunt vel efficitur purus. Nunc nec turpis tempus, accumsan orci auctor,
             imperdiet mauris. Fusce id purus magna."
         CloseOnEscape="false" />

@code {
    bool PopupVisible { get; set; } = false;
}

You can also use the templates listed below to implement a custom close action. In the template, use the context parameter’s CloseCallback property.

• HeaderContentTemplate / BodyContentTemplate / FooterContentTemplate
• HeaderTemplate / BodyTemplate / FooterTemplate