integerField

Basics

The integerField component is designed to provide basic functionality for inputting and displaying integer values.

An example of integerField:

<integerField id="integerField"
              clearButtonVisible="true"
              value="27000"/>
integer field basics
integerField doesn’t handle formatting. Use TypedTextField when you need localized number formatting or support for different data types.

Data Binding

LIVE DEMO

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 integerField. The entity attribute must be of Integer type.

<data>
    <instance class="com.company.onboarding.entity.Step" id="stepDc"> (1)
        <fetchPlan extends="_base"/> (2)
        <loader id="stepDl"/>
    </instance>
</data>
<layout>
    <integerField dataContainer="stepDc"
                  property="duration"/> (3)
</layout>
1 InstanceContainer for the Step entity.
2 Inline fetch plan of the entity instance located in the container.
3 Binding the component to a data container and property. The dataContainer attribute contains a link to the stepDc data container, and the property attribute refers to the duration entity attribute.

Step

Vaadin

The step attribute is used to control the increment or decrement value when the user interacts with the field using the up/down arrows, or the step buttons. Step determines how much the value changes with each interaction. It helps you define the level of precision for the integer field.

The step attribute is typically used in conjunction with min and max properties to define the valid range for the number field.

The stepButtonsVisible attribute controls whether the buttons for increasing/decreasing the value are displayed or hidden.

<integerField step="1"
              stepButtonsVisible="true"
              min="1"
              max="10"
              helperText="Max 10 items"/>
integer field data binding

Validation

To check values entered into the integerField component, you can use a validator in a nested validators element.

The following predefined validators are available for integerField:

XML Element

validators

Predefined validators

custom - digits - max - min - negativeOrZero - negative - notNull - positiveOrZero - positive

Attributes

In Jmix there are many common attributes that serve the same purpose for all components. The following are attributes specific to integerField:

Name

Description

Default

max

Specifies the maximum value of the field. Entering a value which is greater than max invalidates the field.

min

Specifies the minimum value of the field. Entering a value which is smaller than min invalidates the field.

step

Sets the allowed number intervals of the field. This specifies how much the value will be increased/decreased when clicking on the step buttons. See Step.

1

stepButtonsVisible

Sets the visibility of the buttons for increasing/decreasing the value accordingly to the default or specified step. See Step.

false

See Also

See the Vaadin Docs for more information.