Progress Telerik UI for Blazor

Blazor Numeric TextBox

  • The Blazor Numeric TextBox control allows only decimal values and no text. Customize the min and max values, the increment steps for the spin buttons and the format users see.
  • This component is part of the largest truly native Blazor component suite - Telerik UI for Blazor designed to perfectly fit in any app’s requirement.
  • The Blazor UI suite also comes with professionally designed themes enabled with a flip of a switch, document processing library, rich docs & demos to help you get started in no time.
Telerik UI for Blazor Suite
Nasa, Visa, Microsoft Fox, Samsung, IBM World Bank Group, Volvo
  • Blazor Numeric TextBox Overview

    The Blazor Numeric TextBox component allows users to enter numerical values in both Blazor WebAssembly (WASM) and Server-side Blazor apps.  It is used to get number inputs from users and has several out-of-the-box features such as up/down spinner arrows, number format support, max, min and step values, validation, keyboard navigation, globalization, built-in themes and more.


    Telerik UI for Blazor Numeric Textbox Overview
  • Numeric TextBox Formats

    Format the Numeric TextBox with one of the large number of formats listed by Microsoft. Through number formatting, you can easily achieve percentage and currency TextBox behavior in Blazor apps.

    Example of Numeric TextBox formats in Blazor.

    Telerik UI for Blazor Numeric Textbox Formats
  • Numeric TextBox Custom Formats

    The Numeric TextBox also supports any custom format. Using a custom format, you can place any symbol or text as a prefix or suffix to the input number.

    Example of custom kilograms Numeric TextBox formatting in Blazor.

  • Numeric TextBox Validation

    The Telerik UI for Blazor suite supports and integrates seamlessly into Blazor's Forms and Validation infrastructure. All Telerik UI for Blazor Input components (including simple inputs such as TextBox, Numeric TextBox and DateInput) work out of the box when placed inside an EditForm, respond to EditContext changes and provide default invalid styles.

    When you need to validate user input for out of range values, the Telerik Numeric TextBox for Blazor is the perfect match.

    Example of user input validation with Blazor Numeric TextBox component.

    Telerik UI for Blazor Numeric Textbox Validation
  • Numeric TextBox Events

    The Numeric TextBox component exposes 3 events – OnChange, ValueChanged & OnBlur to let you handle user input any way you need to. They are triggered as their names suggest – when the value is submitted, on every keystroke and whenever it loses focus. 

    Telerik UI for Blazor Events
  • Numeric TextBox TabIndex

    The Blazor Numeric TextBox component, just like all other Telerik UI for Blazor input components, supports keyboard navigation to switch between components thanks to the HTML TabIndex property. Pressing Tab will normally focus the next available input component, the same way your users are accustomed to when standard HTML inputs are used. Having the TabIndex setting lets you customize that order.
  • Numeric TextBox Accessibility and Keyboard Navigation

    Like all other Telerik UI for Blazor components, the Numeric TextBox component supports out of the box Keyboard Navigation and web accessibility standards implementation. This enables easy navigation through pages using just keyboard, as well as access to component content through assistive technologies.

    Example of Numeric TextBox with Keyboard Navigation.

    Telerik UI for Bazor Keyboard Navigation
  • Numeric TextBox Globalization and Localization

    The Numeric TextBox has built-in support for localization, which makes it easy to translate your Blazor app to any language your project may require. In addition, the component also features globalization capabilities, so it reflects the device culture and uses it to present the user with the appropriate culture-specific number formats.

    Example of Blazor Numeric TextBox with globalization.

    Telerik UI for Blazor Globalization and Localization
  • Numeric TextBox Theming

    The Telerik Blazor Numeric TextBox component has several built-in themes such as Default (our own styling), Material (based on the Material Design guidelines) and Bootstrap (which looks like the Bootstrap styling to integrate better). You can easily customize any of out-of-the-box themes, style specific component or create new theme using the Telerik Saas ThemeBuilder application.

    Telerik UI for Blazor Numeric Textbox Themes

Next Steps

Launch demos

See Telerik UI for Blazor in action and check out how much it can do out-of-the-box.

Download free trial

Try Telerik UI for Blazor with dedicated technical support.