checkBoxGroup - チェックボックスグループ

選択またはクリアできる複数のボックスを表示します。

カテゴリ

コアコントロール

構文

<xp:checkBoxGroup attributes>content</xp:checkBoxGroup>

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

表 2. 必須プロパティ
カテゴリ	プロパティ
id	デフォルトは `checkBoxGroup1`、`checkBoxGroup2` などです。
value	コントロールをデータ要素またはその他の値にバインドします。
legend	画面で読み取り可能なグループの説明を提供します。

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

使用法

実行時に、1 つ以上のチェックボックスがページに表示されます。ユーザーは、これらのチェックボックスを選択、またはクリアできます。選択されると、ボックス内にチェックマークが表示されます。

チェックボックスにバインドされたデータ要素は、複数の値を許容する必要があります。

アクセシビリティに対応するために、legend プロパティを指定する必要があります。

例

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

<xp:checkBoxGroup id="checkBoxGroup1" legend="Select fruit" value="#{document1.fruit}">
		<xp:selectItem itemLabel="Apples" itemValue="apples"></xp:selectItem>
		<xp:selectItem itemLabel="Oranges" itemValue="oranges"></xp:selectItem>
	</xp:checkBoxGroup>

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

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

このチェックボックスグループは、ビュー列の値から項目の選択を取得します。

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