SpinEdit

Aug 09, 2019
4 minutes to read

SpinEdit enables your end-users to edit numeric values with ease. The editor consists of an edit region and one or two pairs of spin buttons that can be used to adjust the numerical value.

To learn more about SpinEdit and see it in action, refer to our online demos.

Implementation Details

SpinEdit is realized by the SpinEditExtension class. Its instance can be accessed via the ExtensionsFactory.SpinEdit helper method, which is used to add a SpinEdit extension to a view. This method’s parameter provides access to the SpinEdit ‘s settings implemented by the SpinEditSettings class, allowing you to fully customize the extension.

SpinEdit ‘s client counterpart is represented by the ASPxClientSpinEdit object.

Declaration

SpinEdit can be added to a view in the following manner.

View code (ASPX):

csharp

<% 
    Html.DevExpress().SpinEdit(
        settings => {
            settings.Name = "spinEdit1";

            settings.Properties.SpinButtons.ShowLargeIncrementButtons = true;
            settings.Properties.Increment = 0.1M;
            settings.Properties.LargeIncrement = 1;

            settings.Properties.DisplayFormatString = "C";
            settings.Properties.NumberType = SpinEditNumberType.Float;
            settings.Number = 799.95M;
        }
    )
    .Render();
%>

View code (Razor):

csharp

@Html.DevExpress().SpinEdit(
    settings => {
        settings.Name = "spinEdit1";

        settings.Properties.SpinButtons.ShowLargeIncrementButtons = true;
        settings.Properties.Increment = 0.1M;
        settings.Properties.LargeIncrement = 1;

        settings.Properties.DisplayFormatString = "C";
        settings.Properties.NumberType = SpinEditNumberType.Float;
        settings.Number = 799.95M;
    }).GetHtml()

Note

The Partial View should contain only the extension’s code.

The code result is demonstrated in the image below.

Main Features

The SpinEdit extension provides end-users with easy numeric value editing by incrementing and decrementing edit values, using spin buttons, a mouse wheel or keyboard.

The SpinEdit offers the following features.

Customizable Button Visibility and Positions
Float or Integer Value Editing
Customizable Increment/Decrement Values
Customizable Minimum and Maximum Values
Mouse Wheel and Keyboard Support
Auto-Repeat Functionality
Full-Featured Client-Side API