listBox - List Box

Displays a list of items one or more of which can be selected.

Category

Core Controls

Syntax

<xp:listBox attributes>content</xp:listBox>
Table 1. Embedded controls
Control Description
selectItem Provides one item for user selection.
selectItems Provides one or more items for user selection.
Table 2. Essential properties
Property Description
id Defaults to listBox1, listBox2, and so on.
value Binds the control to a data element or other value.
Table 3. All properties
Category Properties
accessibility accesskey, role, tabindex, title
basics attrs, binding, dir, disabled, id, immediate, lang, loaded, multiple, readonly, rendered, rendererType, required
data converter, defaultValue, disableClientSideValidation, disableModifiedFlag, disableValidators, selectedValues, showReadonlyAsDisabled, validator, validators, value, valueChangeListener, valueChangeListeners
dojo dojoAttributes, dojoType
events onblur, onchange, onclick, ondblclick, onfocus, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup
format size
styling disabledClass, disableTheme, enabledClass, style, styleClass, themeId

Usage

At run time, a box with a list of items appears on the page. The user can select one or more items. For more than one item, multiple must be true,

For more than one item, the data element bound to the list box must allow multiple values.

Examples

This List Box control presents two items for selection.
<xp:listBox id="listBox1" value="#{document1.fruit}" multiple="true">
	<xp:selectItem itemLabel="Apples" itemValue="apples"></xp:selectItem>
	<xp:selectItem itemLabel="Oranges" itemValue="oranges"></xp:selectItem>
</xp:listBox>
This List Box control presents two items for selection using a formula.
<xp:listBox id="listBox1" value="#{document1.fruit}"
	multiple="true">
	<xp:selectItems>
		<xp:this.value>
			<![CDATA[#{javascript:return new Array("Apples|apples", "Oranges|oranges")}]]>
		</xp:this.value>
	</xp:selectItems>
</xp:listBox>
This List Box gets its item selections from the values in a view column.
<xp:listBox id="listBox1" value="#{document1.fruit}"
	multiple="true">
	<xp:selectItems>
		<xp:this.value>
			<![CDATA[#{javascript:var list = @DbColumn("", "fruits", 1);
			return @Explode(list,",")}]]>
		</xp:this.value>
	</xp:selectItems>
</xp:listBox>