Ajaxフレームワーク UI部品リファレンス
目次 索引 前ページ次ページ
第2章 画面部品> 2.1 フォーム部品

2.1.14 CheckList

CheckListは、チェックボタンをリスト表示する部品です。チェックボタンは、単一選択および複数選択できます。

■表示例

[図: 単一選択モード]

単一選択モードの場合は、ラジオボタンが表示されます。

[図: 複数選択モード]

複数選択モードの場合は、チェックボックスが表示されます。

■記述形式

<div rcf:type="CheckList" ... ></div>


子要素は指定できません。


本部品は前後に改行コードが挿入されて表示されます。

■プロパティ

表の項目の意味は、“表の項目の意味”を参照してください。

名前

データ型

説明

省略

省略値

属性指定

更新

部分更新

options

Array

表示される項目のリストを指定します。
表示されるラベルは、labelProviderプロパティの指定に従います。

可

[]

値、バインド(注3)

可

可

labelProvider

getLabel()関数を持つObject

各選択項目の文字列を確定する関数を指定します。options配列のメンバに応じた文字列変換ロジックを定義します。getLabel関数には、options配列の個々の要素が渡されます。
nullを指定した場合、デフォルトlabelProviderが使用されます。詳細は、“デフォルトlabelProvider”を参照してください。
以下の場合はエラーとなります。

  • nullおよびObject以外の値が指定された場合
  • getLabel()関数を持たないObjectが指定された場合

可

null(デフォルトlabelProvider)

値

不可

不可

multiple

Boolean

複数選択または単一選択を指定します。

  • true:複数選択
  • false:単一選択

可

false

値

不可

不可

selectedIndex

Number

単一選択の場合

  • 選択されている項目のインデックス(先頭は0)を指定します。
  • 選択状態の初期値を指定できます。
  • -1を指定した場合、選択が解除されます。
  • 無効な値が指定された場合は、エラー(RCF13402)となります。

複数選択の場合

optionsプロパティの値が変更された場合、本プロパティは-1(選択なし)に設定されます。

可

-1

値、バインド

可(注1)

不可

selectedIndexes

NumberのArray

選択されている項目のインデックス(先頭は0)配列を指定します。選択順にインデックスが格納されます。
選択状態の初期値を指定できます。
何も選択されていない場合は、長さ0の配列となります。
無効な値が指定された場合は、エラー(RCF13402)となります。
単一選択(multiple=false)の場合、部品の初期化後に本プロパティを変更しようとするとエラー(RCF11002)となります。“multipleとselectedIndex、selectedIndexesの関係について”を参照してください。
optionsプロパティの値が変更された場合、本プロパティは長さ0の配列(選択なし)に設定されます。

可

[]

値、バインド

可(注2)

可(注2)

title

String

optionsプロパティがStringの配列の場合、またはObjectの配列で、かつ各Objectがtitle属性でない場合に、ツールチップで表示されるテキストを指定します。
なお、optionsプロパティがObjectの配列で、かつObjectがtitle属性の場合は、その値が項目のツールチップとして表示されます。

可

""

値

可

不可

enabled

Boolean

本部品の有効/無効を指定します。

  • true:有効
  • false:無効

可

true

値、バインド

可

不可

tabIndex

Number

Tabキーで移動するフォーカスの順番を指定します。
HTMLのtabindex属性と同様の指定ができます。1以上の整数を指定した場合、数字の小さい順にフォーカスが移動します。
FocusManagerによるフォーカス移動には関係しません。

可

0

値

可

不可

注1) 単一選択(multiple=false)の場合にだけ更新可能
注2) 複数選択(multiple=true)の場合にだけ更新可能
注3) Objectの配列の場合は、バインディング式だけ記述可能

部品共通のプロパティも指定できます。詳細は、“画面部品共通プロパティ”を参照してください。


■スタイルプロパティ

部品全体のスタイルプロパティを以下に示します。

パーツ名

プレフィックス

クラス名

使用可能なスタイル

部品全体

なし

rcf-CheckList
  • サイズ
  • カラー
  • フォント(lineHeightを除く)
  • テキスト(textIndent、textAlign、whiteSpaceを除く)
  • ボーダー
  • パディング

詳細は、“スタイルプロパティ”を参照してください。

選択項目のスタイル

プレフィックス

クラス

スタイルプロパティ

説明

デフォルト

optionSelected
(選択項目)

rcf-CheckList-optionSelected

backgroundColor

選択項目の背景色を指定します。

#004E98

color

選択項目のフォント色を指定します。

#FFFFFF(白)

optionHovered
(マウスオーバー項目)

rcf-CheckList-optionHovered

backgroundColor

マウスオーバー項目の背景色を指定します。

#316AC5

color

マウスオーバー項目のフォント色を指定します。

#FFFFFF(白)

[図: 表示とスタイルプロパティの関係]

表示領域よりも選択項目のサイズが大きくなった場合、以下のように表示されます。

■イベントリスナ

名前

説明

イベントオブジェクト

onFocus

部品がフォーカスを得たときに呼ばれます。

ActionEvent

onBlur

部品がフォーカスを失ったときに呼ばれます。

onChange
(注)

部品の選択状態が変更されたときに呼ばれます。

OptionStateChangeEvent

onOptionSelected
(注)

項目が選択されたときに呼ばれます。

onOptionDeselected
(注)

項目の選択が解除されたときに呼ばれます。
単一選択の場合、optiondeselected、optionselectedの順番でイベントが発生します。

注) マウス、キーボードなどの入力装置によってUI部品を操作した場合に呼ばれるイベントリスナ

部品共通のイベントリスナもあります。詳細は、“画面部品共通イベントリスナ”を参照してください。

■JavaScript API

固有のJavaScript APIはありません。部品共通のJavaScript APIは、“画面部品共通JavaScript API”を参照してください。

■補足事項

目次 索引 前ページ次ページ
Copyright 2008 FUJITSU LIMITED