Show theme settings Shopping cart Download trialFree Trial
Change Theme Settings
Change Theme Settings
Show All Themes


DisplayFormatString = "C"
NullText = "From 1 to 10..."
MinValue = 1
MaxValue = 10
NumberType = Float
Increment = 0.1
LargeIncrement = 1
SpinButtons.ShowLargeIncrementButtons = true

This demo illustrates the primary features of the DevExpress Spin Edit - allowing end-users to edit numeric values with ease. The editor consists of an edit region and one or two pairs of spin buttons which can be used to adjust the numerical value. The editor's value is specified via the Number property.

The Properties.MinValue and Properties.MaxValue properties can be used to define the editor's minimum and maximum allowed values, limiting end-user input to a specified range. These properties limit the Number property value.

The Properties.DisplayFormatString property is used to specify the format pattern used to represent the editor's value within the edit box when the editor is not focused. By using the Properties.NullText property, a prompt can be displayed in the editor's edit box. The specified text is displayed if the editor's value is null and the editor is not focused. The prompt text disappears when the editor receives focus.

Properties.NumberType determines whether the MVC Spin Edit uses float or integer editing mode. In integer mode, float value input is disabled and float values displayed within the editor are automatically rounded once modified. In float mode, culture specific separators are supported, allowing decimal separators to display unique values.

When an end-user presses a small or large spin button, the Number property value is incremented or decremented by the amount specified via Properties.Increment or Properties.LargeIncrement properties respectively. The visibility of small and large spin buttons is managed using the SpinButtons.ShowIncrementButtons and SpinButtons.ShowLargeIncrementButtons properties.

Local Copy of this Demo
To inspect the source code for this demo on your machine, you must first install our components via the DevExpress Component Installer.
You can open a local copy of this online demo directly from this webpage (if using v20.2.8, 21.1.4 or higher).
Open CS Solution
The source code files for this demo are installed (by default) in the following directory:
\Users\Public\Documents\DevExpress Demos XX.X\Components\ASP.NET\CS\MVCxDataEditorsDemos