API REFERENCE · FORM CONTROLS

`<dj-text-input>`

A form-associated text field that composes <dj-label> and <dj-helper-text>. It participates in native forms via ElementInternals: it sets its form value and mirrors the inner input's constraint validity to the host.

Try it in the playground

@dojo-ng/text-input · v0.1.2

npm install @dojo-ng/text-input

import "@dojo-ng/text-input";

Properties

Property	Attribute	Type	Default
`value`	`value`	`string`	`""`
`type`	`type`	`"text""email""number""password""search""tel""url""date"`	`"text"`
`name`	`name` reflected	`string`	None
`placeholder`	`placeholder`	`string`	None
`label`	`label`	`string`	None
`helperText`	`helper-text`	`string`	None
`disabled`	`disabled` reflected	`boolean`	`false`
`readonly`	`readonly` reflected	`boolean`	`false`
`required`	`required` reflected	`boolean`	`false`
`labelHidden`	`label-hidden`	`boolean`	`false`
`autocomplete`	`autocomplete`	`string`	None
`pattern`	`pattern`	`string`	None
`min`	`min`	`string`	None
`max`	`max`	`string`	None
`step`	`step`	`string`	None
`minlength`	`minlength`	`number`	None
`maxlength`	`maxlength`	`number`	None

Events

change

Slots

leadingtrailing

CSS parts

Style these with dj-text-input::part(name).

labelcontrolinputhelper-text

Methods

Method	Description
`checkValidity(): boolean`
`reportValidity(): boolean`
`setCustomValidity(message: string)`	Like a native input's: a non-empty message makes the field invalid until it is cleared with "".
`focus(options: FocusOptions)`
`blur()`