DropDownRestrictionMode Enum

Lists values that specify an element that restricts the DropDown position.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.1.dll

NuGet Package: DevExpress.Blazor

Declaration

public enum DropDownRestrictionMode

Members

Name	Description
Viewport	The drop-down window position is restricted by the viewport.
Page	The drop-down window position is restricted by the page.
Rectangle	The drop-down window position is restricted by a rectangle’s boundaries (RestrictionRectangle).
TargetElement	The drop-down window position is restricted by a target element’s boundaries (RestrictionTarget).

Related API Members

The following properties accept/return DropDownRestrictionMode values:

• DxDropDown.RestrictionMode

Remarks

Set the RestrictionMode property to one of the DropDownRestrictionMode enumeration values to restrict the DropDown position.

Run Demo: DropDown - Automatic Position Adjustment

<OptionsContent>
    <OptionComboBox Label="Close mode:" CssClass="ow-100" Data="@CloseModeSource" @bind-Value="@CloseMode"/>
    <OptionCheckBox Label="Fit to container:" @bind-Checked="FitToRestriction"/>
</OptionsContent>
<ChildContent>
    <div class="@(IsMobile ? "" : "card") flipping-overflow-container">
        <DxButton CssClass="flipping-button" Click="() => IsOpen = true">SHOW A DROPDOWN</DxButton>
        <DxDropDown
            @bind-IsOpen="@IsOpen"
            CloseOnOutsideClick="false"
            PositionMode="DropDownPositionMode.Bottom"
            PositionTarget=".flipping-button"
            RestrictionTarget=".flipping-overflow-container"
            RestrictionMode="DropDownRestrictionMode.TargetElement"
            CloseMode="@CloseMode"
            FitToRestriction="@FitToRestriction"
            Width="240">
            <span style="font-size: 0.75rem">@Constants.ContentShort</span>
        </DxDropDown>
    </div>
</ChildContent>

@code {
@* ... *@
    bool IsOpen { get; set; } = false;
    bool IsMobile { get; set; }
    bool FitToRestriction { get; set; } = true;
    DropDownCloseMode[] CloseModeSource { get; } = Enum.GetValues<DropDownCloseMode>();
    DropDownCloseMode CloseMode { get; set; } = DropDownCloseMode.Hide;
    @* ... *@
}