• What is KendoReact
  • Getting Started
  • Server Components
  • Components
    • Animation
    • Barcodes
    • Buttons
    • Chartsupdated
    • Common Utilities
    • Conversational UIupdated
    • Data Gridupdated
    • Data Query
    • Data Tools
    • Date Inputs
    • Date Math
    • Dialogs
    • Drawing
    • Dropdownsupdated
    • Editor
    • Excel Export
    • File Saver
    • Formupdated
    • Ganttupdated
    • Gauges
    • Indicators
    • Inputsupdated
    • Labels
    • Layoutupdated
    • ListBox
    • ListView
    • Map
    • Notification
    • OrgChartnew
    • PDF Processing
    • PDFViewer
    • PivotGrid
    • Popup
    • Progress Bars
    • Ripple
    • Scheduler
    • ScrollView
    • Sortable
    • Spreadsheetupdated
    • TaskBoard
    • Tooltips
    • TreeList
    • TreeViewupdated
    • Upload
  • Sample Applications
  • Styling & Themes
  • Common Features
  • Project Setup
  • Knowledge Base
  • Changelog
  • Updates
  • Troubleshooting
Components / Inputs / API / MaskedTextBoxProps / 

MaskedTextBoxProps

Represents the props of the KendoReact MaskedTextBox component.

NameTypeDefaultDescription

accessKey?

string

Specifies the accessKey of the MaskedTextBox.

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.

ariaLabelledBy?

string

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

className?

string

Sets a class of the MaskedTextBox DOM element.

defaultValue?

string

Specifies the initial value. Leaves the subsequent updates uncontrolled.

dir?

string

Represents the dir HTML attribute.

disabled?

boolean

Determines whether the MaskedTextBox is disabled.

fillMode?

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

solid

Configures the fillMode of the MaskedTextBox.

The available options are:

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

id?

string

Sets the id of the input DOM element.

includeLiterals?

boolean

Indicates whether to include literals in the raw value. Defaults to false.

label?

string

Renders a floating label for the MaskedTextBox.

mask?

string

Represents the current mask. If no mask is set, the component behaves as a standard type="text" input.

maskValidation?

boolean

Determines whether the built-in mask validator is enforced when a form is validated. Defaults to true.

name?

string

Specifies the name property of the input DOM element.

This property is part of the FormComponentProps interface.

onBlur?

(event: MaskedTextBoxEvent) => void

Fires each time the MaskedTextBox gets blurred.

onChange?

(event: MaskedTextBoxChangeEvent) => void

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

onFocus?

(event: MaskedTextBoxEvent) => void

Fires each time the user focuses the MaskedTextBox.

placeholder?

string

Specifies the input placeholder.

prefix?

CustomComponent<any>

Sets a custom prefix to the MaskedTextBox component.

prompt?

string

Represents a prompt character for the masked value. Defaults to _.

promptPlaceholder?

string

Indicates a character which represents an empty position in the raw value. Defaults to .

readonly?

boolean

Determines whether the MaskedTextBox 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" | "large" | "medium" | "full"

medium

Configures the roundness of the MaskedTextBox.

The available options are:

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

rules?

{[key: string]: RegExp}

Represents the RegExp-based mask validation array.

selection?

{ end: number; start: number; }

Represents the beginning and ending of the selected portion of the input content that will be applied the next time when the MaskedTextBox is rendered.

size?

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

medium

Configures the size of the MaskedTextBox.

The available options are:

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

style?

React.CSSProperties

Sets additional CSS styles to the MaskedTextBox DOM element.

suffix?

CustomComponent<any>

Sets a custom suffix to the MaskedTextBox component.

tabIndex?

number

Sets the tabIndex property of the MaskedTextBox.

title?

string

Sets the title of the input element of the MaskedTextBox.

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?

string

Specifies the value of the MaskedTextBox.

width?

string | number

Specifies the width of the MaskedTextBox.

In this article

Not finding the help you need?

Contact Support