textArea

Basics

Use textArea when the expected input could span multiple lines such as commentary or descriptions.

text area basic
<textArea label="Comment"
          value="Great job. This is excellent!"/>

Unless set to a fixed height, textArea adjusts its height automatically based on its content. The default and minimum height is two rows of text.

Data Binding

Data binding refers to linking a visual component to a data container. Changes in the visual component or corresponding data container can trigger updates to one another. See Using Data Components for more details.

The following example produces a data-aware textArea:

<textArea id="textArea" label="Order description"
          dataContainer="orderDc"
          property="description"/>

Ensure that the entity attribute you are binding to is of String type. Unlike textField, textArea is specifically designed to work with textual data.

Theme Variants

Use the themeNames attribute to adjust text alignment, helper text placement, and component size.

Alignment

Choose among three alignment options: align-left (default), align-right, align-center.

text area alignment
XML code
<textArea themeNames="align-left"/>
<textArea themeNames="align-center"/>
<textArea themeNames="align-right"/>

Helper Text Position

Setting helper-above-field will move the helper text from its default position below the field to above it.

text area helper text position
XML code
<textArea label="Text area label" helperText="Helper text"/>
<textArea themeNames="helper-above-field" label="Text area label" helperText="Helper text"/>

Size

Two size options are available: the default size and small.

text area size
XML code
<textArea/>
<textArea themeNames="small"/>

Attributes

Common attributes serve the same purpose for all components. The following attributes are specific to textArea:

Name

Description

Default

autoselect

Set to true to always have the field value automatically selected when the field gains focus, false otherwise.

maxRows

Sets the maximum number of rows.

minRows

Sets the minimum number of rows.

2

trimEnabled

If true, the component trims spaces at the beginning and at the end of the input. For example: " aaa bbb " will be saved as "aaa bbb".

Configure this setting application-wide using the jmix.ui.component.default-trim-enabled property.

Handlers

Common handlers are configured in the same way for all components. The following handlers are specific to textArea:

To generate a handler stub in Jmix Studio, use the Handlers tab of the Jmix UI inspector panel or the Generate Handler action available in the top panel of the view class and through the CodeGenerate menu (Alt+Insert / Cmd+N).

Name

Description

validator

Adds a validator instance to the component.

See Also

See the Vaadin Docs for more information.