SelectList

The SelectList widget allows a user to select an item from a list of choices.

Implementation base

The SelectList widget is a Dojo-based widget:
  • com.ibm.btt.dijit.Select
It extends from the AbstractListWidget widget.

Properties

The following properties can be configured for the SelectList widget.
Table 1. Properties that can be configured for the SelectList widget.
Property Description
id The id is the identifier for the widget.
dataName The dataName property is the name of the data element to which the widget is bound. This property is not mandatory. When there is no data need to be sent to the server, this property can be left blank. For more information about binding, please refer to Data binding.
urlForList The urlForList property specifies the URL of the .js file that contains the data of the list of choices that are available for selection on the widget.
dataNameForList The dataNameForList property specifies the name of the data, from a WebSphere® Multichannel Bank Transformation Toolkit context or a JSON string, that holds the labels and values of the choices that are available for a user to select on the widget. This is an optional property.
labelField The name of the field in data provider array objects ( dataNameForList or urlForList.) to use as the label field.
valueField The name of the field in data provider array objects ( dataNameForList or urlForList.) to use as the value field.
visibility The visibility property defines how a widget is displayed on a GUI. The following values can be specified for this property:
visible
The widget is displayed on a GUI and users are able to interact with the widget.
hidden
The widget is not displayed on a GUI, but it occupies space on the GUI.
gone
The widget is not displayed on a GUI, and it does not occupy space on the GUI.
disabled Disabled elements cannot have focus, do not receive or fire mouse events, cannot receive user input. If you select a value of true for the disabled property, the widget is displayed on a GUI but a user cannot interact with it. Data contained in a disabled widget is not processed when the form is submitted. The default value for the disabled property is false.
readOnly The readOnly property can be set to keep a user from changing the value. The default value for the readOnly property is false.
hint The hint is a description of the widget that is displayed as a tooltip for a user. The hint property has multilingual support.
shortcut Shortcut is a single character from the document character set. Pressing a shortcut assigned to a widget together with hot key of browser gives focus to the widget. Different widget may have different action when it receives focus. For example, when user activates a TextBox, this TextBox is focused and all texts are selected; when user activates a button, this button is focused and selected. BTT supports shortcut function based on standard html access key and browser capability. That's mean the shortcut character and the hot key may be different in different browsers. For more information about html access key you can refer to the following links:
http://www.w3.org/TR/html4/interact/forms.html#adef-accesskey
http://en.wikipedia.org/wiki/Access_key

Action for SelectList is : focus widget and select all text
Shortcut character : a-z 0-9 , . / ; ' [ ] \ = -
Hot key
Firefox : Shift + Alt + shortcut
IE : Alt + shortcut
Sample
Input on BTT tooling : a
Usage on IE : Pressing Alt + a

styleClass The styleClass property specifies the name of the CSS style ( also known as CSS style class) associated with the widget. This property is set by selecting a style from the CSS styles table in the Style tab of the Properties view. If you do not configure the styleClass property, the default style is used instead. For more detailed information, refer to Setting CSS style to widgets.
width The width property specifies the width of the widget. This property is set in the Appearance tab of the Properties view.

Data binding

If the dataNameForList property is used, its value should be an IndexedCollection. The data elements that are contained in the IndexedCollection that is specified is used by the Select widget; the valueFiled are used as the selection value of the Select widget, and the lavelField are used as the labels that are displayed on the widget.

Note that if values for both the dataNameForList property and the urlForList property have been specified, the value of dataNameForList takes priority over the value of urlForList even if the value of dataNameForList specifies data that does not exist in the context.

At run time, the list of choices that are available for a user to select on the Select widget is updated with either AJAX or with the loadStoreFromURL function.

For more detailed information about data mapping, you can see: Binding data to a select widget

ECA editor support

The following events, properties, and functions can be configured for the SelectList widget with the ECA editor.
Table 2. Events that can be added to the SelectList widget by using the ECA editor.
Event Description
onClick Is fired when the left mouse button is clicked.
onFocus Is fired when the widget receives focus because the user moves the mouse pointer over the widget.
onBlur Is fired when the widget does not receive focus, or when the user clicks outside the widget, or when the widget is hidden.
onKeyDown Is fired when a keyboard key is pressed.
onKeyUp Is fired when a keyboard key is released.
onKeyPress Is fired when a keyboard key is pressed or held down.
onMouseDown Is fired when a mouse button is clicked.
onMouseUp Is fired when a mouse button is released
onMouseEnter Is fired when the mouse pointer moves over the widget.
onMouseLeave Is fired when the mouse pointer moves out of the widget.
onMouseMove Is fired when the mouse pointer moves over nodes that are contained in the widget.
onChange Is fired when the value of the widget changes.
onAsyncOK Is fired when the page has been successfully updated with AJAX.
onAsyncError Is fired when the page has failed to be updated with AJAX.
Table 3. Properties that can be configured for the SelectList widget by using the ECA editor.
Property Description
id The id is the identifier for the widget.
Note: This property can be used in the Condition part of ECA rule.
readOnly The readOnly property can be set to keep a user from changing the value. The default value for the readOnly property is false.
Note: This property can be used in the Condition and Actions part of ECA rule.
value The value property specifies the text that is displayed in the widget.
Note: This property can be used in the Condition and Actions part of ECA rule.
asyncStatus The asyncStatus property specifies the status of the AJAX. The status is provided as an HTTP status code.
Note: This property can be used in the Condition part of ECA rule.
asyncErrorMessage The asyncErrorMessage property provides an error message an AJAX. The error message is retrieved from the browser-side.
Note: This property can be used in the Condition part of ECA rule.
visibility This property defines how a widget is displayed on a GUI. The following values can be specified for this property:
visible
The widget is displayed on a GUI and users are able to interact with the widget.
hidden
The widget is not displayed on a GUI, but it occupies space on the GUI.
gone
The widget is not displayed on a GUI, and it does not occupy space on the GUI.
Note: This property can be used in the Condition and Actions part of ECA rule.
disabled Disabled elements cannot have focus, do not receive or fire mouse events, cannot receive user input. If you select a value of true for the disabled property, the widget is displayed on a GUI but a user cannot interact with it. Data contained in a disabled widget is not processed when the form is submitted. The default value for the disabled property is false.
Note: This property can be used in the Condition and Actions part of ECA rule.
hint The hint is a description of the widget that is displayed as a tooltip for a user. The hint property has multilingual support.
Note: This property can be used in the Actions part of ECA rule.
styleClass The styleClass property specifies the name of the CSS style ( also known as CSS style class) associated with the widget. This property is set by selecting a style from the CSS styles table in the Style tab of the Properties view. If you do not configure the styleClass property, the default style is used instead. For more detailed information, refer to Setting CSS style to widgets.
Note: This property can be used in the Actions part of ECA rule.
Table 4. Functions that can be configured for the SelectList widget by using the ECA editor.
Function Description
loadStoreFromURL The loadStoreFromURL function loads a list of choices that are available for selection from a URL.
Note: The function can be used in the Actions part of ECA rule.
showErrorMessage The showMessage function displays an error message on a GUI.
Note: The function can be used in the Actions part of ECA rule.
isFocusable Returns a value of true if a widget can be focused and a value of false if it cannot be focused.
Note: The function can be used in the Condition part of ECA rule.
focus Specifies that the widget should be focused.
Note: The function can be used in the Actions part of ECA rule.