Skip to main content

DevExpress v24.2 Update — Your Feedback Matters

Our What's New in v24.2 webpage includes product-specific surveys. Your response to our survey questions will help us measure product satisfaction for features released in this major update and help us refine our plans for our next major release.

Take the survey Not interested

DxToolbarItem.DropDownVisible Property

Specifies the state of an item’s drop-down window (visible/hidden).

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.2.dll

NuGet Package: DevExpress.Blazor

#Declaration

C#
[DefaultValue(false)]
[Parameter]
public bool DropDownVisible { get; set; }

#Property Value

Type Default Description
Boolean false

true, if the drop-down window is displayed; otherwise, false.

#Remarks

Each Toolbar item can have multiple child items specified as elements of the parent item’s Items collection. A root-level toolbar item with child items has a drop-down button that displays a hierarchical pop-up menu when clicked.

Use the DropDownVisible property to show/hide a drop-down item’s children. To respond to the property change, handle the DropDownVisibleChanged event.

Razor
<p>Is item exapnded - @IsDropDownVisible</p>
<DxToolbar>
    <DxToolbarItem Text="Data operations" @bind-DropDownVisible="@IsDropDownVisible">
        <Items>
            <DxToolbarItem Text="Insert"></DxToolbarItem>
            <DxToolbarItem Text="Edit"></DxToolbarItem>
            <DxToolbarItem Text="Delete"></DxToolbarItem>
        </Items>
    </DxToolbarItem>
</DxToolbar>

@code {
    bool IsDropDownVisible = false;
}

You can handle a drop-down item’s button as one button or split it into two buttons - a regular button and a drop-down button that invokes a pop-up window. To enable this behavior, set the SplitDropDownButton property to true.

Run Demo: Toolbar - Drop-Down Items

See Also