Drop-down (data entry)
The Drop-down (data entry) widget is responsible for rendering drop-down lists.
This widget renders data supplied by the following components:
The following figure shows how a data entry drop-down list widget
appears on a transformation, using the data from the Input field with hints component example as input:
Figure 1. Data
entry drop-down list widget example
- Caption (from component)
- Number of columns per row (1)
- Fill (from hints)
The following settings can be configured for this widget:
- Fill from global variable
- If selected, fill the drop-down list from
the specified global variables.
- Global variable containing list values
- Specifies the name of the indexed global variable containing the set of values. An item for each index in the global variable will be created in the drop-down list.
- Shared
- ZIETrans local and shared global variables can have the same name. Select this box if you want to use the shared global variable to populate the list items. When this box is cleared, the local global variable is used.
- Global variable containing list captions
- Optional. Specifies the name of the indexed global variable containing the set of captions. The size of the global variable specified by this value should be greater than or equal to the size specified in the preceding setting. The indexes in this indexed global variable should also match up with the indexes in the values global variable (so that the actual value and caption shown to the user are in sync). If this value is not specified, the caption for each item in the drop-down list will be its value.
- Fill from string
- If selected, fill the drop-down list from
the specified string.
- List items
- Optional. Specifies the string of items to include in the drop-down list. Items should be separated with a semicolon
(;). To have the list item caption be different than the list item
value, enter both separated by an equal sign (=). For
example, a value of Apple=A;Grape=G renders a drop-down list with two items: Apple and Grape. Selecting the first
item causes an A to be inserted in the associated host screen input
field.
If you want both the item in the drop-down list and the value inserted in the host screen to be the same, you only need to enter the item. For example, Apple=A;G. In this example, a G appears in the drop-down list and in the host screen input field.
- Fill from hints
- If selected, fill the drop-down list from hints recognized by the component (only applicable when the Input Field with Hints component is used).
- Caption source
- Specifies how the caption for the generated drop-down list is determined. Options: From component (use the extracted caption from the
component) or Custom (use
the specified caption).
- Custom caption
- Optional. Specifies the caption for the drop-down list.
Note: Leave this setting blank to not generate a caption for the drop-down list.
- Number of displayable rows
- The number of rows in the drop-down list that are visible to the user. If more than this number of items are in the list, scroll bars appear so the user can scroll through the entire list. The default is 1.
- Number of columns per row
- The number of drop-down lists to display
horizontally before wrapping to the next line.Note:
- This setting is not applicable in default rendering.
- The widget preview does not always match the full page preview. This happens because the widget preview simply renders the component's output. It does not try to preserve the alignment of the screen when it renders, as is done in the full page preview.
- Auto submit on select
- If selected, once a selection is made in the drop-down list, it is submitted.
- Show submit button
- If selected, a submit button is rendered
next to the drop-down list.
- Submit button caption
- Optional. Specifies the caption of the submit button.
- Drop-down style class (Web-only)
- Optional. The CSS style class associated with the generated drop-down list. The value of the class attribute of the HTML drop-down tag will be set to this value. The default value is HATSDROPDOWN. See Using style sheets for more information.
- List option style class (Web-only)
- Optional. The CSS style class associated with each option in the drop-down list. The default value is HATSOPTION. See Using style sheets for more information.
- Caption style class (Web-only)
- Optional. The CSS style class associated with the caption of the generated drop-down list. The default value is HATSCAPTION. See Using style sheets for more information.
- Table style class (Web-only)
- Optional. The CSS style class associated with the generated table. If more than one drop-down list is rendered, an HTML table will be generated to enclose these drop-down lists. The value of the class attribute of the HTML table tag will be set to this value. The default value is HATSTABLE. See Using style sheets for more information.
- Style (Web-only)
- Optional. Any CSS properties that you want to override. For example, you can specify font-color: red; font-size: 18pt; in this field to change the font color and size for this widget. The properties you enter apply to each element of this widget. Use the launcher button next to this field to open a style properties dialog. This dialog frees you from the need to understand CSS to change the font, color, or other style settings for the widget. See Using style sheets for more information.