Integer control

This control creates a field in which a user can view or enter a number value.

Data binding

Set or modify the data binding for the Integer control in the General properties tab. The control is bound to an Integer variable.

Configuration properties

Set or modify configuration properties for the Integer control, such as appearance and behavior properties, in the Configuration properties tab. Set the formula configuration properties in the Events tab.

Screen size: A configuration property that has the Screen Sizes icon beside the property name can have different values for each screen size. If you do not set a value, the screen size inherits the value of the next larger screen size as its default value. If you are using the Process Designer desktop editor, you are setting the value for the large screen size. The other screen sizes inherit this value.

Theme definitions: Theme definitions specify the colors and styles for a control and determine the appearance of the control. You can preview the look and feel of controls in the theme editor. See Themes.

The appearance configuration properties for the Integer control are listed in the following table:

Table 1. Appearance configuration properties for the Integer control
Appearance configuration property	Description	Data type
Width	The width of the control. You can specify the width in px (pixels), % (percent), or em units. For example, 50px, 20%, or 0.4em. If a unit type is not specified, px is assumed.	`String`
Size style	The size of the text in the control.	`String`
Label placement	The label placement for this control. Left placement of the label changes the specified width of the control.	`String`

The behavior configuration properties for the Integer control are listed in the following table:

Table 2. Behavior configuration properties for the Integer control
Behavior configuration property	Description	Data type
Tab index	The tabbing sequence index of the form control. The tab indices start at 1 and can be set sparsely. For example, you can use 1, 5, 10. The Tab index property controls the tabbing sequence when you move between coach areas by pressing the Tab key.	`Integer`
Placeholder text	The placeholder text that is displayed when no value is entered.	`String`
Numeric formatting	Determines whether the thousands separator is based on the current user's locale or specified as a custom configuration option. The available options are Auto and Custom.	`String`
Hide thousands separator	Hides the thousands separator. By default, this option is not selected.	`Boolean`
Thousands separator	Separates the thousands in digit grouping. Commas are most commonly used as thousands separators. Based on the user's locale, other symbols (such as periods) or custom characters can be used as thousands separators.	`String`
Prefix	A symbol that precedes the numerical input values.	`String`
Postfix	A symbol that succeeds the numerical input values.	`String`

Example

To specify the formatting for an integer number that you to display in your coach, add an Integer control to the coach layout, and then set its configuration properties as follows:

Under Appearance, set Size style to Default, and Label placement to Top.
Under Behavior, set Thousands separator to , (comma), and Prefix to $.
Save your changes.

In the result, an input value of 1500 is displayed as $1,500.

Events

Set or modify the formula configuration properties and the event handlers for the control in the Events tab. You can set events to be triggered programmatically or when a user interacts with the control. For information on how to define and code events, see User-defined events.

The formula configuration properties for the Integer control are shown in the following table:

Table 3. Formula configuration properties for the Integer control
Formula configuration property	Description	Data type
Value formula	The formula that specifies how the value is displayed in the control. You can use static `String` values or formulas or aggregate functions. For more information about using formulas, see Binding data and configuration options.	`String`

The Integer control has the following types of event handlers:

On load: Activated when the page loads. For example:
```
me.setValue(0.00);
```

On change: Activated when the value changes. For example:

${Decimal1}.setValue(oldValue); ${Decimal2}.setValue(newValue);

On focus: Activated when the focus moves to the integer field. For example:
```
${Tooltip1}.setTooltipVisible(true)
```
On blur: Activated when the control loses the focus. For example:
```
${Tooltip1}.setTooltipVisible(false);
```
On format: Activated when the user applies custom formatting to the input values. The formatting is based on the return value of the statement. For example:
```
var neg = me.getValue() < 0; if (neg){return "(" + formattedValue + ")"}
```

Depending on the specific event, you can use JavaScript logic to modify the effects of the control. More information on using events with controls is found in the topic User-defined events.

Methods

For detailed information on the available methods for the Integer control, see the JavaScript documentation.

Additional resources

For information about how to create a coach, see Building coaches.
For information about standard properties (General, Configuration, Positioning, Visibility, and HTML Attributes), see Coach view properties.