Development tools : XUI editor : XUI widgets and containers : Widget descriptions : Combo
  
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 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 for the Combo widget
 
Property
Description
id
The identifier for the widget.
dataName
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.
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 toolkit context or a JSON string, which 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 value of the field in data provider array objects ( dataNameForList or urlForList) to use as the value field.
isMandatory
The isMandatory property specifies whether a user is required to enter a value in the text box.
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; and cannot receive user input. If you set this property to true, 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 is false.
readOnly
To prevent a user from changing the value, set readOnly to true. The default value is false.
hint
A description of the widget that is displayed as a tooltip for a user. This 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. The toolkit supports a 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 keys, see:
Action for Combo 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 UDTT 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.
typeAhead
This typeAhead property indicates whether the value can be editable or not.
True (Default): editable
False: read-only
This property is set to True in code and is not available in tooling.
Data binding
If the dataNameForList property is used, its value must be an IndexedCollection. The fields that are contained in the record of the IndexedCollection that is specified is used by the Combo widget as Combo label; 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 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. This means that if values for both the dataNameForList property and the urlForList property have been specified, the value of the urlForList 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.
For more detailed information about data mapping, see Binding data to a Combo widget.
See
ECA editor support
Go up to
Widget descriptions