SpinEdit

  • 4 min 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):

<% 
    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):

@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.

spinedit-declaration.png

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.

ASPxSpinEdit_control.png

The SpinEdit offers the following features.