Group Box form control

A form control that shows a group of buttons on your form.


Group Box form control

Configure the Group Box form control

To configure the Group Box Group Box icon control, do the procedure in this topic.

Video: Common Configuration Settings in eForm Controls

Good to Know

How to Start

  1. Open eForm Builder.

    For information about how to open this screen, refer to eForm Builder screen.


    Eform Builder screen
  2. On the eForm Builder screen, in the Tool Box, open the Commmon Controls tab.

    Common Controls tab
  3. On the Common Controls tab, drag a Group Box Group Box icon form control onto your eForm.

    Group Box Form Control

Procedure

  1. Complete the settings on the configuration screens.

    You can use the Data screen screen to specify a variable.

General

Specifies the basic configuration for the Group Box form control.

Figure: General tab

General tab

Fields

Field NameDefinition

Label

Description:
Specifies the text label that shows on your form for the control.
Allowed Values:
One line of text (a string).

Accepted:

  • Letters
  • Numbers
  • Spaces
Default Value:
Different for different controls.
Example:
This is a common configuration field that is used in many examples. Refer to:
  • Examples - Step-by-step use case examples, information about what types of examples are provided in the AgilePoint NX Product Documentation, and other resources where you can find more examples.

Internal Name

Description:
Specifies a unique, technical name for your control.
Allowed Values:
One line of text (a string).

Not Accepted:

  • Spaces
Default Value:
Different for different controls.
Example:
This is a common configuration field that is used in many examples. Refer to:
  • Examples - Step-by-step use case examples, information about what types of examples are provided in the AgilePoint NX Product Documentation, and other resources where you can find more examples.

Configure

Configures advanced settings for your form control.

Figure: Configure tab

Configure tab

Fields

Field NameDefinition

Child Alignment

Description:
Specifies the alignment of the button controls in the group box.
Allowed Values:
  • Left - Aligns the button controls to the left.
  • Center - Aligns the button controls to the center.
  • Right - Aligns the button controls to the right.
Default Value:
Left

Show Border

Description:
Specifies if the eForm shows a border around the panel.
Allowed Values:
  • Deselected - Shows no border.
  • Selected - Shows the border.
Default Value:
Selected

Show Header Label

Description:
Specifies if the form panel shows a label at the top.
Allowed Values:
  • Deselected - Shows no label at the top.
  • Selected - Shows label at the top.
Default Value:
Selected

Appearance

Specifies the look and feel for your form control.

Figure: Appearance tab

Appearance tab

Fields

Field NameDefinition

Font Family

Description:
Specifies the font family of the input text and label.
Allowed Values:
A font name from the list.
Default Value:
  • Modern theme - Roboto
  • Classic theme - Arial
Example:
Refer to:

Font Style

Description:
Specifies the style of the font for the input text and label.
Allowed Values:
  • Bold - Shows the input text and label in bold.
  • Underline - Shows the label underlined.
  • Italic - Shows the label in italic.
Default Value:
None
Example:
Refer to:

Background Color

Description:
Specifies the background color for your control.
Allowed Values:
A color value using a hex code, RGB code, or RGBA code.

You can enter a color code, or select a color from the palette.

Default Value:
#ff0000
Example:
Refer to:

Border Color

Description:
Specifies the border color for your control.
Allowed Values:
A color value using a hex code, RGB code, or RGBA code.

You can enter a color code, or select a color from the palette.

Default Value:
#ff0000
Example:
Refer to:

Foreground Color

Description:
Specifies the foreground color for your control.
Allowed Values:
A color value using a hex code, RGB code, or RGBA code.

You can enter a color code, or select a color from the palette.

Default Value:
#ff0000
Example:
Refer to:

Container CSS Class

Description:
Specifies a CSS class for the container of your control.
Allowed Values:
A valid CSS class.
Default Value:
None

If you specify your CSS CSS icon on the top menu, the CSS is populated.

Example:
Refer to:

Font Size (px)

Description:
Specifies the size of the input text and label for your form control.
Allowed Values:
An integer.

Range

  • Greater than 0
Default Value:
  • Classic theme - 12
  • Modern theme - 14
Example:
Refer to:

Behavior

Specifies how the control shows on your form.

Figure: Behavior tab

Behavior tab

Fields

Field NameDefinition

Enabled

Description:
Specifies if the form user can change the value of a field.
Allowed Values:
  • Selected - The form user can change the value.
  • Deselected - The input cannot change the value.
Default Value:
Selected
Example:
Refer to:

Read-Only

Description:
Specifies if the field accepts user input.
Allowed Values:
  • Selected - A user cannot enter a value for the field. The field shows as read-only.
  • Deselected - A user can enter a value for the field.
Default Value:
Deselected

Visible

Description:
Specifies if the runtime app user sees the field.
Allowed Values:
  • Selected - The runtime app user sees the field.
  • Deselected - The runtime app user does not see the field.
Default Value:
Selected
Example:
Refer to:

Advanced

Specifies advanced settings for your form control.

Figure: Advanced tab

Advanced tab

Fields

Field NameDefinition

Field ID

Description:
Shows an ID of the control.
Allowed Values:
Read only.
Default Value:
Different for different controls.
Example:
Refer to:

Show On Tablet Devices

Description:
Specifies if the form field shows on a tablet.
Allowed Values:
  • Selected - The form field shows on a tablet.
  • Deselected - The form field does not show on a tablet.
Default Value:
Selected
Example:
Refer to:

Show On Mobile Phone Devices

Description:
Specifies if the form field shows on a mobile device.
Allowed Values:
  • Selected - The form field shows on a mobile device.
  • Deselected - The form field does not show on a mobile device.
Default Value:
Selected
Example:
Refer to: