TextBoxComponent

Represents the Kendo UI TextBox component for Angular. Use this component to create styled and feature-rich text input fields.

html

<kendo-textbox placeholder="Enter text"></kendo-textbox>

Selector

kendo-textbox

Export Name

Accessible in templates as #kendoTextBoxInstance="kendoTextBox"

Inputs

Name	Type	Default	Description
clearButton	boolean	false	Shows a Clear button in the TextBox.
clearButtonIcon	string		Sets a custom icon for the Clear button.
clearButtonSvgIcon	SVGIcon		Sets a custom SVG icon for the Clear button.
disabled	boolean	false	Sets the disabled state of the TextBox. To disable the component in reactive forms, see Forms Support.
errorIcon	string		Sets a custom icon for invalid user input.
errorSvgIcon	SVGIcon		Sets a custom SVG icon for invalid user input.
fillMode	InputFillMode	'solid'	Sets the background and border styles of the TextBox (see example).
inputAttributes	{[key: string]: string}		Sets the HTML attributes of the inner focusable input element. You cannot change attributes that are essential for component functionality.
maxlength	number		Sets the maximum length of the TextBox value.
placeholder	string		Sets the placeholder text displayed when the component is empty.
readonly	boolean	false	Sets the read-only state of the component.
rounded	InputRounded	'medium'	Sets the border radius of the TextBox (see example).
selectOnFocus	boolean	false	Highlights the whole value when you click the TextBox.
showErrorIcon	IconShowOptions	false	Specifies when to show the Error icon (see example).
showSuccessIcon	IconShowOptions	false	Specifies when to show the Success icon (see example).
size	InputSize	'medium'	Sets the padding of the TextBox internal input element (see example).
successIcon	string		Sets a custom icon for valid user input.
successSvgIcon	SVGIcon		Sets a custom SVG icon for valid user input.
tabindex	number	0	Specifies the tabindex of the TextBox.
title	string		Sets the title attribute of the input element of the TextBox.
type	InputType	'text'	Sets the type attribute of the input element of the TextBox.
value	string		Provides a value for the TextBox.

Fields

Name	Type	Default	Description
input	ElementRef<any>		Gets a reference to the visible input element of the TextBox.

Events

Name	Type	Description
inputBlur	EventEmitter<any>	Fires when the input element is blurred.
inputFocus	EventEmitter<any>	Fires when the user focuses the input element.
blur	EventEmitter<any>	Fires when the TextBox component is blurred.
focus	EventEmitter<any>	Fires when the user focuses the TextBox component.
valueChange	EventEmitter<any>	Fires when the value changes—when the component is blurred or the value is cleared through the Clear button (see example). Does not fire when you change the value programmatically through ngModel or formControl.

Methods

blur
Removes focus from the TextBox.

focus
Focuses the TextBox.