DxEditorButton.Position Property

Specifies the button’s position in the editor.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v23.2.dll

NuGet Package: DevExpress.Blazor

Declaration

[DefaultValue(EditorButtonPosition.Right)]
[Parameter]
public EditorButtonPosition Position { get; set; }

Property Value

Type	Default	Description
EditorButtonPosition	Right	A EditorButtonPosition enumeration value.

Available values:

Name	Description
Left	The button is placed at the left edge of the editor.
Right	The button is placed at the right edge of the editor.

Remarks

The code below adds two custom buttons to the Date Edit to different positions.

<DxDateEdit @bind-Date="@DateTimeValue"
            CssClass="dx-demo-editor-width">
    <Buttons>
        <DxEditorButton IconCssClass="editor-icon editor-icon-chevron-left-small"
                        Tooltip="Previous day"
                        Position="@EditorButtonPosition.Left"
                        Click="@(_ => OnChangeDayButtonClick(false))" />
        <DxEditorButton IconCssClass="editor-icon editor-icon-chevron-right-small"
                        Tooltip="Next day"
                        Position="@EditorButtonPosition.Right"
                        Click="@(_ => OnChangeDayButtonClick(true))" />
    </Buttons>
</DxDateEdit>

@code{
    DateTime DateTimeValue { get; set; } = DateTime.Today;
        void OnChangeDayButtonClick(bool isAdd) {
            DateTimeValue = DateTimeValue.AddDays(isAdd ? 1 : -1);
        }
}

Run Demo: Editors - Command Buttons