Skip to main content
All docs
V25.1
  • DxSpinEditSettings Class

    Contains settings of an auto-generated spin editor.

    Namespace: DevExpress.Blazor

    Assembly: DevExpress.Blazor.v25.1.dll

    NuGet Package: DevExpress.Blazor

    Declaration

    public class DxSpinEditSettings :
        DxButtonEditSettings,
        ISpinEditSettings,
        IButtonEditSettings,
        ITextEditSettings,
        IEditSettings

    Remarks

    The DxSpinEditSettings class contains settings of auto-generated spin editors displayed in edit cells, filter row, inline, and pop-up edit forms.

    Auto-Generated Spin Editor in Filter Row and Edit Cells

    Grid and TreeList components automatically generate editors for columns based on their data types. For numeric types, they generate a spin editor. Use properties of the DxSpinEditSettings class to customize settings of auto-generated spin editors. To apply these settings, specify a DxSpinEditSettings object in a column’s EditSettings property.

    Note that if you specify spin editor settings for a column that contains non-numeric values, these settings have no effect and the component renders a read-only text box editor instead.

    In the following code snippet, the Grid renders spin editors for ProductID, UnitPrice, and UnitsInOrder columns. The ProductID column’s markup contains the DxSpinEditSettings object that customizes the auto-generated editor.

    <DxGrid Data="@products" 
            ShowFilterRow="true" 
            EditMode="GridEditMode.EditRow">
        <Columns>
            <DxGridCommandColumn />
            <DxGridDataColumn FieldName="ProductID" >
                <EditSettings>
                    <DxSpinEditSettings ShowSpinButtons="false" ReadOnly="true" NullText="Type the ID" />
                </EditSettings>
            </DxGridDataColumn>
            <DxGridDataColumn FieldName="ProductName" />
            <DxGridDataColumn FieldName="UnitPrice" />
            <DxGridDataColumn FieldName="UnitsInOrder" />
        </Columns>
    </DxGrid>
    

    Modified Editors

    Auto-Generated Spin Editor in Edit Forms

    You can display an auto-generated column editor in the inline or pop-up edit form. Call the GetEditor method to get the column editor in the edit form template.

    <DxGrid Data="@products" 
            ShowFilterRow="true">
        <Columns>
            <DxGridCommandColumn />
            <DxGridDataColumn FieldName="ProductID" >
                <EditSettings>
                    <DxSpinEditSettings ShowSpinButtons="false" ReadOnly="true" NullText="Type the ID" />
                </EditSettings>
            </DxGridDataColumn>
            <DxGridDataColumn FieldName="ProductName" />
            <DxGridDataColumn FieldName="UnitPrice" />
            <DxGridDataColumn FieldName="UnitsInOrder" />
        </Columns>
        <EditFormTemplate Context="EditFormContext">
            <DxFormLayout >
                <DxFormLayoutItem Caption="Product ID:" ColSpanMd="6">
                    @EditFormContext.GetEditor("ProductID")
                </DxFormLayoutItem>
                <DxFormLayoutItem Caption="Product Name:" ColSpanMd="6">
                    @EditFormContext.GetEditor("ProductName")
                </DxFormLayoutItem>
                <DxFormLayoutItem Caption="Unit Price:" ColSpanMd="6">
                    @EditFormContext.GetEditor("UnitPrice")
                </DxFormLayoutItem>
                <DxFormLayoutItem Caption="Units In Order:" ColSpanMd="6">
                    @EditFormContext.GetEditor("UnitsInOrder")
                </DxFormLayoutItem>
            </DxFormLayout>
        </EditFormTemplate>
    </DxGrid>
    

    Editors in Edit Form

    Runtime Customization

    At runtime, call the GetColumnEditSettings method to access settings of a spin editor in the specified column. The following code snippet dynamically disables the editor.

    <DxGrid @ref="grid" Data="@products" EditMode="GridEditMode.EditRow" >
        <Columns>
            <DxGridCommandColumn />
            <DxGridDataColumn FieldName="ProductID" />
            <DxGridDataColumn FieldName="ProductName" />
            <DxGridDataColumn FieldName="UnitPrice" DisplayFormat="c" />
            <DxGridDataColumn FieldName="UnitsInOrder" />
        </Columns>
    </DxGrid>
    <DxButton Text="Disable the ID" Click="Button_Click" />
    
    @code {
        IGrid grid { get; set; }
        private Product[]? products;
        protected override async Task OnInitializedAsync() {
            products = await ProductData.GetData();
        }
        void Button_Click() {
            var settings = grid.GetColumnEditSettings<ISpinEditSettings>("ProductID");
            grid.BeginUpdate();
            settings.Enabled = false;
            grid.EndUpdate();
        }
    }
    

    Inheritance

    Object
    ComponentBase
    DevExpress.Blazor.Internal.BranchedRenderComponent
    DevExpress.Blazor.Internal.ParameterTrackerSettingsComponent
    See Also