RadzenNumeric<TValue> Class

A numeric input component that allows users to enter numbers with optional increment/decrement buttons and value constraints. RadzenNumeric supports various numeric types, formatting, min/max validation, step increments, and culture-specific number display. Provides up/down arrow buttons for incrementing/decrementing the value by a specified step amount. Supports min/max constraints that are enforced during input and stepping, formatted value display using standard .NET format strings, and can be configured with or without the up/down buttons. Handles overflow protection and respects the numeric type's natural limits.

Inheritance

Object

ComponentBase

RadzenComponent

FormComponent<TValue>

FormComponentWithAutoComplete<TValue>

RadzenNumeric<TValue>

Implements

IComponent

IHandleEvent

IHandleAfterRender

IRadzenFormComponent

Inherited Members

FormComponentWithAutoComplete<TValue>.AutoCompleteType

FormComponentWithAutoComplete<TValue>.AutoCompleteAttribute

FormComponentWithAutoComplete<TValue>.DefaultAutoCompleteAttribute

FormComponentWithAutoComplete<TValue>.DefaultAriaAutoCompleteAttribute

FormComponentWithAutoComplete<TValue>.AriaAutoCompleteAttribute

FormComponent<TValue>.GetValue

FormComponent<TValue>.NotifyFieldChanged

FormComponent<TValue>.OnContextMenu

FormComponent<TValue>.GetClassList

FormComponent<TValue>.Name

FormComponent<TValue>.TabIndex

FormComponent<TValue>.Placeholder

FormComponent<TValue>.Disabled

FormComponent<TValue>.EditContext

FormComponent<TValue>.Form

FormComponent<TValue>.ValueChanged

FormComponent<TValue>.IsBound

FormComponent<TValue>.Change

FormComponent<TValue>.FieldIdentifier

FormComponent<TValue>.ValueExpression

FormComponent<TValue>.FormFieldContext

FormComponent<TValue>.CurrentPlaceholder

FormComponent<TValue>._value

RadzenComponent.OnMouseEnter

RadzenComponent.OnMouseLeave

RadzenComponent.GetCssClass

RadzenComponent.GetId

RadzenComponent.Debounce

RadzenComponent.Localize

RadzenComponent.OnInitialized

RadzenComponent.RaiseContextMenu

RadzenComponent.RaiseMouseEnter

RadzenComponent.AddContextMenu

RadzenComponent.RaiseMouseLeave

RadzenComponent.OnBecameInvisible

RadzenComponent.Attributes

RadzenComponent.Element

RadzenComponent.MouseEnter

RadzenComponent.MouseLeave

RadzenComponent.ContextMenu

RadzenComponent.Culture

RadzenComponent.DefaultCulture

RadzenComponent.UICulture

RadzenComponent.DefaultUICulture

RadzenComponent.Style

RadzenComponent.Visible

RadzenComponent.UniqueID

RadzenComponent.JSRuntime

RadzenComponent.IsJSRuntimeAvailable

RadzenComponent.Reference

RadzenComponent.CurrentStyle

ComponentBase.OnInitializedAsync

ComponentBase.OnParametersSet

ComponentBase.OnParametersSetAsync

ComponentBase.StateHasChanged

ComponentBase.ShouldRender

ComponentBase.OnAfterRender

ComponentBase.InvokeAsync

ComponentBase.DispatchExceptionAsync

ComponentBase.RendererInfo

ComponentBase.Assets

ComponentBase.AssignedRenderMode

Namespace: Radzen.Blazor

Assembly: Radzen.Blazor.dll

Syntax

public class RadzenNumeric<TValue> : FormComponentWithAutoComplete<TValue>, IComponent, IHandleEvent, IHandleAfterRender, IRadzenFormComponent

Type Parameters

Name Description
TValueThe numeric type of the value. Supports int, long, short, byte, float, double, decimal and their nullable variants.

Examples

Basic integer numeric input with constraints:

<RadzenNumeric @bind-Value=@quantity TValue="int" Min="1" Max="100" Step="1" />

Decimal input with custom formatting:

<RadzenNumeric @bind-Value=@price TValue="decimal" Min="0" Format="c" Placeholder="Enter price" />

Nullable numeric without increment buttons:

<RadzenNumeric @bind-Value=@optionalValue TValue="int?" ShowUpDown="false" Placeholder="Optional" />

Suppressing the default ArrowUp/ArrowDown increment behavior via the

event (e.g. to allow custom keyboard navigation between inputs):

<RadzenNumeric @bind-Value=@value TValue="int" KeyDown=@OnKeyDown />
@code {
    int value;
    void OnKeyDown(NumericKeyboardEventArgs args)
    {
        var key = args.OriginalEvent.Code ?? args.OriginalEvent.Key;
        if (key == "ArrowUp" || key == "ArrowDown")
        {
            args.PreventDefault();
            // custom logic: focus next/previous input, etc.
        }
    }
}

Constructors

RadzenNumeric<TValue>Link to this section

A numeric input component that allows users to enter numbers with optional increment/decrement buttons and value constraints. RadzenNumeric supports various numeric types, formatting, min/max validation, step increments, and culture-specific number display. Provides up/down arrow buttons for incrementing/decrementing the value by a specified step amount. Supports min/max constraints that are enforced during input and stepping, formatted value display using standard .NET format strings, and can be configured with or without the up/down buttons. Handles overflow protection and respects the numeric type's natural limits.

Declaration
public RadzenNumeric<TValue>()

Fields

inputLink to this section

Gets input reference.

Declaration
protected ElementReference input

Properties

AriaInvalidLink to this section

Gets the value exposed via the aria-invalid attribute of the spinbutton input. Returns "true" when the current value is outside the configured Min/Max range, or null when the value is within range or Min/Max are not set.

Declaration
protected string AriaInvalid { get; }
Property Value
Type Description
stringGets the value exposed via the aria-invalid attribute of the spinbutton input. Returns "true" when the current value is outside the configured Min/Max range, or null when the value is within range or Min/Max are not set.

AriaLabelLink to this section

Gets or sets the accessible name applied to the spinbutton input via the aria-label attribute. When not set, the component falls back to Name so the spinbutton has an accessible name by default.

Declaration
public string AriaLabel { get; set; }
Property Value
Type Description
stringGets or sets the accessible name applied to the spinbutton input via the aria-label attribute. When not set, the component falls back to Name so the spinbutton has an accessible name by default.

AriaValueMaxLink to this section

Gets the value exposed via the aria-valuemax attribute of the spinbutton input. Returns the configured Max formatted with the invariant culture, or null when Max is not set.

Declaration
protected string AriaValueMax { get; }
Property Value
Type Description
stringGets the value exposed via the aria-valuemax attribute of the spinbutton input. Returns the configured Max formatted with the invariant culture, or null when Max is not set.

AriaValueMinLink to this section

Gets the value exposed via the aria-valuemin attribute of the spinbutton input. Returns the configured Min formatted with the invariant culture, or null when Min is not set.

Declaration
protected string AriaValueMin { get; }
Property Value
Type Description
stringGets the value exposed via the aria-valuemin attribute of the spinbutton input. Returns the configured Min formatted with the invariant culture, or null when Min is not set.

AriaValueNowLink to this section

Gets the value exposed via the aria-valuenow attribute of the spinbutton input. Returns the current numeric value formatted with the invariant culture, or null when there is no value.

Declaration
protected string AriaValueNow { get; }
Property Value
Type Description
stringGets the value exposed via the aria-valuenow attribute of the spinbutton input. Returns the current numeric value formatted with the invariant culture, or null when there is no value.

AriaValueTextLink to this section

Gets the value exposed via the aria-valuetext attribute of the spinbutton input. Returns the formatted display value when a non-trivial Format is applied, or null otherwise.

Declaration
protected string AriaValueText { get; }
Property Value
Type Description
stringGets the value exposed via the aria-valuetext attribute of the spinbutton input. Returns the formatted display value when a non-trivial Format is applied, or null otherwise.

ConvertValueLink to this section

Gets or sets the function which returns TValue from string.

Declaration
public Func<string, TValue> ConvertValue { get; set; }
Property Value
Type Description
Func<string, TValue>Gets or sets the function which returns TValue from string.

DownAriaLabelLink to this section

Gets or sets the down button aria-label attribute.

Declaration
public string DownAriaLabel { get; set; }
Property Value
Type Description
stringGets or sets the down button aria-label attribute.

FormatLink to this section

Gets or sets the format.

Declaration
public string Format { get; set; }
Property Value
Type Description
stringGets or sets the format.

FormattedValueLink to this section

Gets or sets the formatted value.

Declaration
protected string FormattedValue { get; set; }
Property Value
Type Description
stringGets or sets the formatted value.

HasValueLink to this section

Gets a value indicating whether this instance has value.

Declaration
public bool HasValue { get; }
Property Value
Type Description
boolGets a value indicating whether this instance has value.

ImmediateLink to this section

Gets or sets whether the component should update the bound value immediately as the user types (oninput event), rather than waiting for the input to lose focus (onchange event). This enables real-time value updates but may trigger more frequent change events.

Declaration
public bool Immediate { get; set; }
Property Value
Type Description
boolGets or sets whether the component should update the bound value immediately as the user types (oninput event), rather than waiting for the input to lose focus (onchange event). This enables real-time value updates but may trigger more frequent change events.

InputAriaLabelLink to this section

Gets the accessible name applied to the spinbutton input. Returns null when the consumer has already supplied an aria-label or aria-labelledby attribute via Attributes or InputAttributes, so a consumer-supplied accessible name is never overridden.

Declaration
protected string InputAriaLabel { get; }
Property Value
Type Description
stringGets the accessible name applied to the spinbutton input. Returns null when the consumer has already supplied an aria-label or aria-labelledby attribute via Attributes or InputAttributes, so a consumer-supplied accessible name is never overridden.

InputAttributesLink to this section

Gets or sets additional HTML attributes to be applied to the underlying input element. This allows passing custom attributes like data-* attributes, aria-* attributes, or other HTML attributes directly to the input.

Declaration
public IReadOnlyDictionary<string, object> InputAttributes { get; set; }
Property Value
Type Description
IReadOnlyDictionary<string, object>Gets or sets additional HTML attributes to be applied to the underlying input element. This allows passing custom attributes like data-* attributes, aria-* attributes, or other HTML attributes directly to the input.

InputSizeLink to this section

Gets or sets the size of the component.

Declaration
public InputSize InputSize { get; set; }
Property Value
Type Description
InputSizeGets or sets the size of the component.

KeyDownLink to this section

Gets or sets an event callback raised when a key is pressed while the input is focused. Call PreventDefault on the argument to suppress the built-in ArrowUp/ArrowDown increment/decrement behavior and allow custom key handling (e.g. navigating to the next/previous input).

Declaration
public EventCallback<NumericKeyboardEventArgs> KeyDown { get; set; }
Property Value
Type Description
EventCallback<NumericKeyboardEventArgs>Gets or sets an event callback raised when a key is pressed while the input is focused. Call PreventDefault on the argument to suppress the built-in ArrowUp/ArrowDown increment/decrement behavior and allow custom key handling (e.g. navigating to the next/previous input).

MaxLink to this section

Determines the maximum value.

Declaration
public decimal? Max { get; set; }
Property Value
Type Description
decimal?Determines the maximum value.

MaxLengthLink to this section

Gets or sets the maximum allowed text length.

Declaration
public long? MaxLength { get; set; }
Property Value
Type Description
long?Gets or sets the maximum allowed text length.

MinLink to this section

Determines the minimum value.

Declaration
public decimal? Min { get; set; }
Property Value
Type Description
decimal?Determines the minimum value.

ReadOnlyLink to this section

Gets or sets a value indicating whether is read only.

Declaration
public bool ReadOnly { get; set; }
Property Value
Type Description
boolGets or sets a value indicating whether is read only.

ShowUpDownLink to this section

Gets or sets a value indicating whether up down buttons are shown.

Declaration
public bool ShowUpDown { get; set; }
Property Value
Type Description
boolGets or sets a value indicating whether up down buttons are shown.

StepLink to this section

Gets or sets the step.

Declaration
public string Step { get; set; }
Property Value
Type Description
stringGets or sets the step.

TextAlignLink to this section

Gets or sets the text align.

Declaration
public TextAlign TextAlign { get; set; }
Property Value
Type Description
TextAlignGets or sets the text align.

UpAriaLabelLink to this section

Gets or sets the up button aria-label attribute.

Declaration
public string UpAriaLabel { get; set; }
Property Value
Type Description
stringGets or sets the up button aria-label attribute.

ValueLink to this section

Gets or sets the value.

Declaration
public TValue Value { get; set; }
Property Value
Type Description
TValueGets or sets the value.

Methods

BuildRenderTreeLink to this section

Declaration
protected override void BuildRenderTree(Rendering.RenderTreeBuilder __builder)
Parameters
Type Name Description
Rendering.RenderTreeBuilder __builder

DisposeLink to this section

Declaration
public override void Dispose()

FocusAsyncLink to this section

Sets the focus on the input element.

Declaration
public override ValueTask FocusAsync()
Returns
Type Description
ValueTask

GetComponentCssClassLink to this section

Declaration
protected override string GetComponentCssClass()
Returns
Type Description
string

OnAfterRenderAsyncLink to this section

Declaration
protected override Task OnAfterRenderAsync(bool firstRender)
Parameters
Type Name Description
bool firstRender
Returns
Type Description
Task

OnChangeLink to this section

Handles the change event.

Declaration
protected Task OnChange(ChangeEventArgs args)
Parameters
Type Name Description
ChangeEventArgs args The ChangeEventArgs instance containing the event data.
Returns
Type Description
Task

SetParametersAsyncLink to this section

Declaration
public override Task SetParametersAsync(ParameterView parameters)
Parameters
Type Name Description
ParameterView parameters
Returns
Type Description
Task
An error has occurred. This app may no longer respond until reloaded. Reload 🗙