• What is KendoReact
  • Getting Started
  • Components
    • Animation
    • Barcodes
    • Buttons
    • Chartsupdated
    • Common Utilitiesupdated
    • Conversational UI
    • Data Gridupdated
    • Data Query
    • Data Tools
    • Date Inputsupdated
    • Date Math
    • Dialogs
    • Drawing
    • Dropdownsupdated
    • Editorupdated
    • Excel Export
    • File Saver
    • Form
    • Gantt
    • Gauges
    • Indicators
    • Inputsupdated
    • Labels
    • Layoutupdated
    • ListBox
    • ListView
    • Map
    • Notification
    • PDF Processing
    • PDFViewerupdated
    • PivotGrid
    • Popup
    • Progress Bars
    • Ripple
    • Scheduler
    • ScrollView
    • Sortable
    • Spreadsheetnew
    • TaskBoard
    • Tooltips
    • TreeList
    • TreeView
    • Upload
  • Sample Applications
  • Styling & Themes
  • Common Features
  • Project Setup
  • Knowledge Base
  • Changelog
  • Updates
  • Troubleshooting
Components / Inputs / API / NumericTextBoxProps / 

NumericTextBoxProps

Represents the props of the KendoReact NumericTextBox component.

NameTypeDefaultDescription

accessKey?

string

Specifies the accessKey of the NumericTextBox.

ariaDescribedBy?

string

Identifies the element(s) which will describe the component, similar to HTML aria-describedby attribute. For example these elements could contain error or hint message.

ariaLabel?

string

The accessible label of the component.

ariaLabelledBy?

string

Identifies the element(s) which will label the component.

className?

string

Sets a class of the NumericTextBox DOM element.

defaultValue?

"null" | number

Specifies the initial value. Leaves the subsequent updates uncontrolled.

dir?

string

Represents the dir HTML attribute.

disabled?

boolean

Determines whether the NumericTextBox is disabled.

fillMode?

"null" | "flat" | "outline" | "solid"

solid

Configures the fillMode of the NumericTextBox.

The available options are:

  • solid
  • outline
  • flat
  • null—Does not set a fillMode className.

format?

string | NumberFormatOptions

Specifies the number format which is used for formatting the value (see example). If set to an empty string or undefined, the default format will be used. Format cannot contain decimal separators or numbers. Power signs are supported.

id?

string

Sets the id of the input DOM element.

inputStyle?

React.CSSProperties

Represents the input element style HTML attribute.

inputType?

NumericTextBoxInputType

Sets the type of the input DOM element.

The available options are:

  • (Default) tel
  • text

label?

string

Renders a floating label for the NumericTextBox.

max?

number

Specifies the greatest value that can be entered.

min?

number

Specifies the smallest value that can be entered.

name?

string

Specifies the name of the input DOM element.

placeholder?

string

Specifies the input placeholder.

prefix?

CustomComponent<any>

Sets a custom prefix to the NumericTextBox component.

rangeOnEnter?

boolean

If enabled, the NumericTextBox will handle the enter key to range the current invalid value between min and max props. The available options are:

  • (Default) true
  • false

Can be disabled when form submit is required on pressing the enter key.

readOnly?

boolean

Determines whether the NumericTextBox is in its read-only state.

required?

boolean

Specifies if null is a valid value for the component.

This property is part of the FormComponentProps interface.

rounded?

"null" | "small" | "medium" | "full" | "large"

medium

Configures the roundness of the NumericTextBox.

The available options are:

  • small
  • medium
  • large
  • full
  • null—Does not set a rounded className.

size?

"null" | "small" | "medium" | "large"

medium

Configures the size of the NumericTextBox.

The available options are:

  • small
  • medium
  • large
  • null—Does not set a size className.

spinners?

boolean

Specifies whether the Up and Down spin buttons will be rendered (see example).

step?

number

Specifies the value that is used to increment or decrement the value of the NumericTextBox (see example).

style?

React.CSSProperties

Represents the style HTML attribute.

suffix?

CustomComponent<any>

Sets a custom suffix to the NumericTextBox component.

tabIndex?

number

Sets the tabIndex property of the NumericTextBox.

title?

string

Sets the title of the input element of the NumericTextBox.

valid?

boolean

Overrides the validity state of the component. If valid is set, the required property will be ignored.

This property is part of the FormComponentProps interface.

validationMessage?

string

Controls the form error message of the component. If set to an empty string, no error will be thrown.

This property is part of the FormComponentProps interface.

validityStyles?

boolean

If set to false, no visual representation of the invalid state of the component will be applied.

This property is part of the FormComponentProps interface.

value?

"null" | number

Specifies the value of the NumericTextBox.

width?

string | number

Specifies the width of the NumericTextBox.

Methods

onBlur

The event handler that will be fired when NumericTextBox is blurred.

Parameters

event

NumericTextBoxBlurEvent

onChange

Determines the event handler that will be fired when the user edits the value.

Parameters

event

NumericTextBoxChangeEvent

onFocus

The event handler that will be fired when NumericTextBox is focused.

Parameters

event

NumericTextBoxFocusEvent

In this article

Not finding the help you need?

Contact Support