Combo

The Combo widget allows a user to either enter a value or to select an item from a list of choices. The labels and the choices that are available on the ComboBox widget for a user to select are retrieved from a WebSphere® Multichannel Bank Transformation Toolkit context or from an external source, for example, a web service. A change in the choice that has been selected by a user in a Combo widget can be detected by the other widgets on the page.

Implementation base

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

Properties

The following properties can be configured for the Combo widget.
Table 1. Properties that can be configured for the Combo widget.
Property Description
dataName The dataName property is the name of the data element to which the widget is bound. This property is optional.
styleClass The styleClass property specifies the class selector that is associated with the widget. If you do not configure the styleClass property, the default class selector is used instead.
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 The disabled property is an expert-level property, which means that it is available for use in the XUI editor only if the XUI editor is configured to display expert properties. 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 is an expert-level property, which means that it is available for use in the XUI editor only if the XUI editor is configured to display expert properties. If you select a value of true for the readOnly property, the widget is displayed on a GUI but a user cannot interact with it. If a widget has the value of its readOnly property set to true and the value of its disabled property set to false, the data of the widget is taken into account during form submission. The default value for the readOnly property is false.
id The id is the identifier for the widget.
hint The hint is a description of the widget that is displayed as a tooltip for a user. The hint property has multilingual support.
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.
width The width property specifies the width of the property.
isMandatory The isMandatory property specifies whether a user is required to enter a value in the text box.
shortcut The shortcut property specifies a keyboard shortcut for the widget. If a user enters the keyboard shortcut on a client, the widget receives focus on the GUI of the client. You can specify either a single character as the value of the shortcut property, or you can specify Ctrl and a character as the value of the shortcut property.

Data mapping

If the dataNameForList property is used, its value must be either a KeyedCollection or an IndexedCollection. The fields that are contained in the KeyedCollection or the IndexedCollection that is specified is used by the Combo widget; the names of the fields are used as the selection values of the Combo widget, and the values of the fields are used as the labels that are displayed on the widget.

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

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

ECA editor support

The following events, properties, and functions can be configured for the Combo widget with the ECA editor.
Table 2. Events that can be added to the Combo 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 Combo widget by using the ECA editor.
Property Description
readOnly The readOnly property is an expert-level property, which means that it is available for use in the XUI editor only if the XUI editor is configured to display expert properties. If you select a value of true for the readOnly property, the widget is displayed on a GUI but a user cannot interact with it. If a widget has the value of its readOnly property set to true and the value of its disabled property set to false, the data of the widget is taken into account during form submission. The default value for the readOnly property is false.
value The value property specifies the text that is displayed in the widget.
asyncStatus The asyncStatus property specifies the status of the AJAX. The status is provided as an HTTP status code.
asyncErrorMessage The asyncErrorMessage property provides an error message an AJAX. The error message is retrieved from the browser-side.
Table 4. The following functions can be configured for the Combo 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.
showErrorMessage The showMessage function displays an error message on a GUI.