Numeric input script component
A Numeric input component accepts numeric digits only. Numeric input is most often used with information that an agent collects or updates.
Click Numeric on the component toolbar.
To assign a default value to this component, bind it to the value of a variable. Expand the Advanced group. Below Value click Select Variable. Then choose a variable. The component will display the runtime value of that variable.
- Use Range properties to set Minimum and Maximum values to constrain user input.
To assign an action to invoke when the user provides input, select No action selected from the Change Action list.
To select an action, click a row. Assign a previously defined action or create a new action.
- Close the Select Action list.
Set any other properties of this component.
Common
The Value property binds a component to the variable selected. For example, if you bind a text input component to a variable, the input box will always display the value of that variable, ignoring any placeholder text specified. The variable is automatically updated with text typed by the user, subject to validation processing.
Other controls, radio buttons for example, use Value with a Selected Value Text setting. When the radio button is selected at runtime, its "Selected Value Text" becomes the new value of the variable. This way, each radio button can assign a different value to same variable.
When a calendar control is bound to the variable, its value is set to the date selected by the control. Since variables can preset the value of visual controls and also be set by them, binding is a powerful and often-used technique.
Configure the Label by selecting a variable, entering text, and choosing a position.
The Range property sets minimum and maximum bounds selectable by a numeric input component. You can set the upper and lower limits to integer values or leave the setting at none. The default is None, meaning that the no limits are set. You can enter any numeric value.
If you select Integer, you can specify a minimum or maximum value.
Layout
Configures width to a fixed size, to grow as needed to display content, or to consume as much space as possible relative to other components, using weighting to influence size adjustments.
- Auto-sizing configures the component to shrink or grow in accordance with its contents. For example, the width of a label can grow depending up on how much text it contains.
- Stretch allows a component to consume as much space as possible relative to other components, using weighting to influence size adjustments.Note: If two components are both set to stretch, they are both allocated 50% of the remaining space by default. This proportion can be adjusted by changing the weight value. For example, if you set one component to a weight of 200, and the other to a weight of 100, then the first component occupies two thirds of the remaining space, while the other only takes one third. The first component appears twice the size of the other component, since its weight was two times the second component's weight.
- px sets a fixed size in pixels. You can type an integer value into the box, or use up or down arrows to increment or decrement size. These arrows are visible when the component has focus.
Configures height to a fixed size, to grow as needed to display content, or to consume as much space as possible relative to other components, using weighting to influence size adjustments.
- Auto-sizing configures the component to shrink or grow in accordance with its contents. For example, the width of a label can grow depending up on how much text it contains.
- Stretch allows a component to consume as much space as possible relative to other components, using weighting to influence size adjustments.Note: If two components are both set to stretch, they are both allocated 50% of the remaining space by default. This proportion can be adjusted by changing the weight value. For example, if you set one component to a weight of 200, and the other to a weight of 100, then the first component occupies two thirds of the remaining space, while the other only takes one third. The first component appears twice the size of the other component, since its weight was two times the second component's weight.
- px sets a fixed size in pixels. You can type an integer value into the box, or use up or down arrows to increment or decrement size. These arrows are visible when the component has focus.
Aligns a component to the left, right, or center, relative to its parent container.
Auto Sizing. To correct this, set the parent container's Height to Stretch or to a fixed height in Pixels.Margins set left, right, top, and bottom spacing around a border.
- Click the value field for a margin. A spin control appears in that field.
- Use the spin control to increase or decrease the margin.
- To update all margin values at once, click the Set All button for Margin in the properties panel.
The Visible property sets the visibility of a component based on the value of a Boolean (True or False) variable or an expression.
To set the Visible property based on a variable:
- Click the Layout property group in the Properties panel.
- Under Visible, click Select Variable.
- Select a variable, or optionally create a new Yes/No variable and then assign that new variable to the Visible property.
- At runtime, the component is visible when the value of the variable is True. Conversely it is hidden when the variable's value is False.
To set the Visible property based on an expression:
- Click the Layout property group in the Properties panel.
- Under Visible, select True/False Expression.
- In the Insert Variable box, enter an expression .
At runtime, the component is visible when the expression is True. The component is hidden when the expression is False.
Appearance
Configure the Label Style by selecting:
- Font
- Style
- Size
- Justification
Advanced
The Value property binds a component to the variable selected. For example, if you bind a text input component to a variable, the input box will always display the value of that variable, ignoring any placeholder text specified. The variable is automatically updated with text typed by the user, subject to validation processing.
Other controls, radio buttons for example, use Value with a Selected Value Text setting. When the radio button is selected at runtime, its "Selected Value Text" becomes the new value of the variable. This way, each radio button can assign a different value to same variable.
When a calendar control is bound to the variable, its value is set to the date selected by the control. Since variables can preset the value of visual controls and also be set by them, binding is a powerful and often-used technique.
The Range property sets minimum and maximum bounds selectable by a numeric input component. You can set the upper and lower limits to integer values or leave the setting at none. The default is None, meaning that the no limits are set. You can enter any numeric value.
If you select Integer, you can specify a minimum or maximum value.
All components are enabled by default. The Disabled property binds a True/False variable to a component, to disable or enable it based on the runtime value of the variable.
- To create a True/False variable, click the Variables tab.
- Click Add to add a variable.
- Select True/False as the data type.
- In the Name box, type a descriptive name.
- Set Default Value to True or False.
- If the variable is True, then the component is disabled.
- If the variable is False, then the component is enabled.
- To save the variable, click Apply.
- Assign the variable to the Disabled property. Below Disabled, click Select Variable.
- Select the True/False variable.
To test your work, click Preview.
The Change Action property allows you to set an action that executes when the state or value of this component is changed.
You can select a Scripter action, an Outbound Action, or a custom action. Outbound actions are not available unless the Outbound property is enabled.
[NEXT] Was this article helpful?
Get user feedback about articles.