comboBox - コンボボックス

複数の項目のリストを表示します。それらの項目からいずれか 1 つを選択できます。

カテゴリ

コアコントロール

構文

<xp:comboBox attributes>content</xp:comboBox>

表 1. 埋め込みコントロール
コントロール	説明
selectItem	ユーザー選択用の 1 つの項目を示します。
selectItems	ユーザー選択用の 1 つ以上の項目を示します。

表 2. 必須プロパティ
プロパティ	説明
id	デフォルトは `comboBox1`、`comboBox2` などです。
text	ラベルを示します。
value	コントロールをデータ要素またはその他の値にバインドします。

表 3. すべてのプロパティ
カテゴリ	プロパティ
アクセシビリティ	accesskey、role、tabindex、title
basics	attrs、binding、dir、disabled、id、immediate、lang、loaded、readonly、rendered、rendererType、required
data	converter、defaultValue、disableClientSideValidation、disableModifiedFlag、disableValidators、 showReadonlyAsDisabled、validator、validators、value、valueChangeListener、valueChangeListeners
dojo	dojoAttributes、dojoType
イベント	onblur、onchange、onclick、ondblclick、onfocus、onkeydown、 onkeypress、onkeyup、onmousedown、onmousemove、onmouseout、onmouseover、onmouseup
styling	disabledClass、disableTheme、enabledClass、style、styleClass、themeId

使用法

実行時に、ドロップダウンリストがページに表示されます。ユーザーは 1 つの項目を選択できます。

例

下のコンボボックスコントロールには、選択用の 2 つの項目があります。

<xp:comboBox id="comboBox1" value="#{document1.fruit}">
	<xp:selectItem itemLabel="Apples" itemValue="apples"></xp:selectItem>
	<xp:selectItem itemLabel="Oranges" itemValue="oranges"></xp:selectItem>
</xp:comboBox>

下のコンボボックスコントロールには、式を使用した、選択用の 2 つの項目があります。

<xp:comboBox id="comboBox1" value="#{document1.fruit}">
	<xp:selectItems>
		<xp:this.value>
			<![CDATA[#{javascript:return new Array("Apples|apples", "Oranges|oranges")}]]>
		</xp:this.value>
	</xp:selectItems>
</xp:comboBox>

このコンボボックスは、ビュー列の値から項目の選択を取得します。

<xp:comboBox id="comboBox1" value="#{document1.fruit}">
	<xp:selectItems>
		<xp:this.value>
			<![CDATA[#{javascript:var list = @DbColumn("", "fruits", 1);
			return @Explode(list,",")}]]>
		</xp:this.value>
	</xp:selectItems>
</xp:comboBox>