DxFlyout.PreventCloseOnPositionTargetClick Property

Specifies whether the flyout window should be closed when a user clicks the position target element.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.1.dll

NuGet Package: DevExpress.Blazor

Declaration

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

Property Value

Type	Default	Description
Boolean	true	false to close the flyout window on any outside click; true to keep the flyout window open when the position target element is clicked.

Remarks

If the CloseOnOutsideClick property is set to true, the flyout window is closed when a user clicks outside the window’s boundaries. However, the component prevents the window from closing when a user clicks an element specified by the PositionTarget property. This behavior allows you to change window visibility on a position target element click in the following way:

<DxButton Id="targetButton" Click="() => IsOpen = !IsOpen">Show/Hide a flyout window</DxButton>
<DxFlyout @bind-IsOpen=IsOpen 
          PositionTarget="#targetButton" 
          Width=400
          BodyText="Lorem ipsum dolor sit amet, consectetur adipiscing elit.">
</DxFlyout>

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

Set the PreventCloseOnPositionTargetClick property to false to close the flyout window when a user clicks the target element.