ui:inputCheckbox
チェックボックスを表します。クリックや変更などのイベントを使用して、動作を設定できます。
ui:inputCheckbox コンポーネントは、value および disabled 属性によって状態が制御されるチェックボックスを表します。checkbox 型の HTML input タグとして表示されます。ui:inputCheckbox コンポーネントからの出力を表示するには、ui:outputCheckbox コンポーネントを使用します。
次に、チェックボックスの基本設定を示します。
この例の結果、次の HTML になります。
value 属性はチェックボックスの状態を制御し、click や change などのイベントはその動作を決定します。次の例は、クリックイベント時のチェックボックスの CSS クラスを更新します。
次の例は、ui:inputCheckbox コンポーネントの値を取得します。
属性
| 属性名 | 属性型 | 説明 | 必須項目 |
|---|---|---|---|
| body | Component[] | コンポーネントのボディ。マークアップでは、これはタグのボディに含まれるすべてを指します。 | |
| class | String | コンポーネントに添付される CSS スタイル。このスタイルは、コンポーネントで出力される基本スタイルに追加されます。 | |
| disabled | Boolean | コンポーネントを無効な状態で表示するかどうかを指定します。デフォルト値は「false」です。 | |
| label | String | コンポーネントに表示されるテキスト。 | |
| labelClass | String | 表示ラベルコンポーネントの CSS クラス。 | |
| name | String | コンポーネントの名前。 | |
| required | Boolean | 入力が必須かどうかを指定します。デフォルト値は「false」です。 | |
| requiredIndicatorClass | String | 必須のインジケータコンポーネントの CSS クラス。 | |
| text | String | 入力値の属性。 | |
| updateOn | String | 処理されたイベントに updateOn 属性が設定されている場合、コンポーネントの値のバインドを更新します。デフォルト値は「change,click」です。 | |
| value | Boolean | オプションの状況が選択されているかどうかを示します。デフォルト値は「false」です。 |
イベント
| イベント名 | イベントタイプ | 説明 |
|---|---|---|
| mouseup | COMPONENT | ユーザがマウスボタンを放したことを示します。 |
| mousedown | COMPONENT | ユーザがマウスキーを押したことを示します。 |
| mousemove | COMPONENT | ユーザがマウスポインタを移動したことを示します。 |
| dblclick | COMPONENT | コンポーネントがダブルクリックされたことを示します。 |
| mouseout | COMPONENT | ユーザがマウスポインタをコンポーネントから移動したことを示します。 |
| click | COMPONENT | コンポーネントがクリックされたことを示します。 |
| mouseover | COMPONENT | ユーザがマウスポインタをコンポーネントに移動したことを示します。 |
| keyup | COMPONENT | ユーザがキーボードキーを放したことを示します。 |
| keypress | COMPONENT | ユーザがキーボードキーを押したままにしたことを示します。 |
| select | COMPONENT | ユーザが選択を行ったことを示します。 |
| keydown | COMPONENT | ユーザがキーボードキーを押してから放したことを示します。 |
| focus | COMPONENT | コンポーネントにフォーカスが置かれたことを示します。 |
| blur | COMPONENT | コンポーネントからフォーカスが離れたことを示します。 |
| validationError | COMPONENT | コンポーネントに検証エラーがあることを示します。 |
| paste | COMPONENT | ユーザがコンテンツをクリップボードから貼り付けたことを示します。 |
| change | COMPONENT | コンポーネントのコンテンツまたは状況が変更されたことを示します。 |
| clearErrors | COMPONENT | 検証エラーをすべてクリアする必要があることを示します。 |
| cut | COMPONENT | ユーザがコンテンツを切り取ってクリップボードに保存したことを示します。 |
| copy | COMPONENT | ユーザがコンテンツをクリップボードにコピーしたことを示します。 |