# TextBox Group

(part of package '[Servoy Extra Components](https://docs.servoy.com/reference/servoyextensions/packages/ui-component-packages/servoy-extra-components)')\
Extends designtime/SolutionModel: [JSWebComponent](https://docs.servoy.com/reference/servoycore/dev-api/solutionmodel/jswebcomponent)\
Extends runtime: [RuntimeWebComponent](https://docs.servoy.com/reference/servoycore/dev-api/forms/runtimeform/elements/runtimewebcomponent)

A Servoy Extra Component that groups one or more text fields, allowing for combined data input and validation.

This is a reference page; many components have detailed usage guides [here](https://docs.servoy.com/guides/develop/application-design/ui-components).

## Properties

### dataProviderID

Bound data provider identifier for the text field group value. Type: [Dataprovider](https://docs.servoy.com/servoy-developer/component_and_service_property_types#dataprovider)

***

### enabled

Flag indicating whether the text field group is enabled for user interaction. Type: [Enabled](https://docs.servoy.com/servoy-developer/component_and_service_property_types#protected) Default Value: true

***

### faclass

CSS style classes applied to the icon associated with the text field group. Type: [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string)

***

### format

Format string used to display and parse the text field group value. Type: [Format](https://docs.servoy.com/servoy-developer/component_and_service_property_types#format)

***

### inputType

Specifies the type of input for the text field group (for example, "text" or "password"). Type: [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) Default Value: "text"

***

### inputValidation

Specifies the validation to apply to the input (for example, "none" or "email"). Type: [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) Default Value: "text"

***

### invalidEmailMessage

Message displayed when an invalid email address is entered. Type: [Tagstring](https://docs.servoy.com/servoy-developer/component_and_service_property_types#tagstring) Default Value: "This is an invalid email address"

***

### placeholderText

Placeholder text displayed when the text field group is empty. Type: [Tagstring](https://docs.servoy.com/servoy-developer/component_and_service_property_types#tagstring)

***

### readOnly

Flag indicating whether the text field group is read-only. Type: [Protected](https://docs.servoy.com/servoy-developer/component_and_service_property_types#protected) Default Value: false

***

### styleClass

CSS style classes applied to the text field group component. Type: [Styleclass](https://docs.servoy.com/servoy-developer/component_and_service_property_types#styleclass) Default Value: "form-control"

***

### tabSeq

Tab sequence order for keyboard navigation. Type: [Tabseq](https://docs.servoy.com/servoy-developer/component_and_service_property_types#tabseq)

***

### visible

Flag indicating whether the text field group is visible. Type: [Visible](https://docs.servoy.com/servoy-developer/component_and_service_property_types#visible)

***

## Events

### onActionMethodID(event)

Called when the text field group triggers an action.

**Parameters:**

> * {[JSEvent](https://docs.servoy.com/reference/servoycore/dev-api/application/jsevent)} event The event object containing details about the action event.

***

### onDataChangeMethodID(oldValue,newValue,event)

Called when the value of the text field group changes.

**Parameters:**

> * {[${dataproviderType}](https://docs.servoy.com/servoy-developer/component_and_service_property_types#dataprovider)} oldValue The previous value from the data provider.
> * {[${dataproviderType}](https://docs.servoy.com/servoy-developer/component_and_service_property_types#dataprovider)} newValue The new value to be set.
> * {[JSEvent](https://docs.servoy.com/reference/servoycore/dev-api/application/jsevent)} event The event object associated with the data change.

**Returns:** {[Boolean](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/boolean)}

***

### onFocusGainedMethodID(event)

Called when the text field group gains focus.

**Parameters:**

> * {[JSEvent](https://docs.servoy.com/reference/servoycore/dev-api/application/jsevent)} event The event object containing details about the focus gained event.

***

### onFocusLostMethodID(event)

Called when the text field group loses focus.

**Parameters:**

> * {[JSEvent](https://docs.servoy.com/reference/servoycore/dev-api/application/jsevent)} event The event object containing details about the focus lost event.

***

### onRightClickMethodID(event)

Called when the text field group is right-clicked.

**Parameters:**

> * {[JSEvent](https://docs.servoy.com/reference/servoycore/dev-api/application/jsevent)} event The event object containing details about the right-click event.

***

## API

### isValid()

Checks whether the current input is a valid email address or if the input is empty.

**Returns:** [Boolean](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/boolean) Returns true if the input is valid (i.e., it is a valid email address or the input is empty); otherwise, false.

***

### requestFocus(mustExecuteOnFocusGainedMethod)

Request the focus to this field.

**Example:**

```js
myElement.requestFocus();
```

**Parameters:**

> * {[Boolean](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/boolean)} \[mustExecuteOnFocusGainedMethod] If false will not execute the onFocusGained method; the default value is true

***

***