入力

データ型 (ストリング、数値、日付/時刻、およびマスク) の入力フィールドを作成することができます。 入力コンポーネントをページに追加する場合は、 「入力」コンポーネントの「プロパティー」ビューで、 いずれかのフォーマットを選択してください。

設計時のコンポーネント

「入力」コンポーネントを、 ページ上にドラッグ・アンド・ドロップします。

「入力」コンポーネントのボタン

設計時の「入力」コンポーネントは、 ページ上でこのように表示されます。

設計時の「入力」

実行時のコンポーネント

実行時の「入力」コンポーネントは、 ページ上でこのように表示されます。

実行時の「入力」

「プロパティー」ビューと「すべての属性」ビュー

コンポーネントの「プロパティー」ビューには、 コンポーネントに設定できる最も一般的な属性のセットが表示されます。 コンポーネントによっては、制御、アクション、 または他のコンポーネントの追加に関するオプションが 表示される場合もあります。 「プロパティー」ビューを開くには、 「ウィンドウ」 > 「ビューの表示」 > 「プロパティー」とクリックします。

「入力」コンポーネントの共通属性は、 「プロパティー」ビューの「h:inputText」タブ、 「妥当性検査」タブ、「振る舞い」タブ、 および「アクセシビリティー」タブに表示されます。 属性の完全なリストについては、「入力」のすべての属性 の 表を参照してください。 入力の妥当性検査、振る舞いの変更、 および入力フォーマット・タイプの構成を行うための追加構成オプションは、 「h:inputText」>「妥当性検査」タブ、 「h:inputText」>「振る舞い」タブ、 および「h:inputText」タブにあります。

表 1. 「入力」のすべての属性

構成オプション

説明

自動的に次のフィールドに進む

自動タブを有効/無効に設定します。 指定された文字数が入力されると、 自動的に次の入力フィールドに進みます。 チェックすると、hx:inputHelperAssist セクションを 「すべての属性」ビューに追加し、autoTab を true に設定します。

カスタム検証コードを作成/編集するには、ここをクリック

「クイック編集」ビューに切り替えて、 さまざまなユーザー開始イベント用に、 コードのスクリプトまたはスニペットを入力できるようにします。

入力制限 (Constraint)

コンポーネントに入力できる 文字のタイプを制限します (数字のみ、ASCII アルファベット のみ、など)。 regex 属性を持つ hx:validateConstraint を 「すべての属性」ビューに追加します。

エラー・メッセージ・コントロールに検証エラー・メッセージを表示

選択されたコンポーネントに関連付けられたエラー・メッセージ・ コンポーネントを挿入します。 これによって、妥当性検査が失敗すると、エラー・メッセージが表示されるようになります。

フォーマット

コンポーネントが取り扱うデータのフォーマットを指定します。
  • ストリング - 出力が、テキスト・ストリングの書式であることを指定します。
  • 数値 - 出力が、数値の書式であることを指定します。
  • 日付/時刻 - 出力が、日付または時刻 (あるいはその両方) の書式であることを指定します。
  • マスク - 出力が、特定の値を選択的に含む方法、または除外する方法で、フィルター処理されることを指定します。
詳しくは、個々のフォーマット・タイプ表を参照してください。

最大長

サーバーで実行されるときに、このコンポーネントに 含むことができる最大文字数。maximum 属性を持つ f:validateLength 関数を、 「すべての属性」ビューに追加します。

最小長

サーバーで実行されるときに、このコンポーネントに 含むことができる最小文字数。minimum 属性を持つ f:validateLength 関数を、 「すべての属性」ビューに追加します。

ブラウザーでフィールド値を検証

実行時に、ブラウザーでフィールド検証を行うことができます。

表 2. 「フォーマット・タイプ」の構成オプション

フォーマット・タイプ

フォーマット・オプション

ストリング

「h:inputText」タブ:
  • ID
  • スタイル: プロパティー
  • スタイル: クラス
  • サイズ: 幅
「妥当性検査」タブ:
  • 値を必須にする
  • 最大長
  • 最小長
  • 入力制限 (Constraint)
  • カスタム検証コードを作成/編集するには、ここをクリック
  • エラー・メッセージ・コントロールに検証エラー・メッセージを表示
「振る舞い」タブ:
  • コントロールを使用不可にする
  • コントロールを読み取り専用にする
  • 自動的に次のフィールドに進む
  • ユーザーが X 文字を入力後 (After user types X characters)
  • ブラウザーでフィールド値を検証
  • onBlur アクションと onFocus アクション (onBlur and onFocus actions)

数値

「h:inputText」タブ:
  • ID
  • スタイル: プロパティー
  • スタイル: クラス
  • サイズ: 幅
  • タイプ: 10 進数 (Type: Decimal)
  • オプション
  • 整数のみ
  • ヘルパー・ボタンの表示
  • 種類
  • 増分
  • プロンプト文字の表示
  • プロンプト文字
  • タイプ: 通貨 (Type: Currency)
  • オプション
  • 通貨記号
  • 整数のみ
  • ヘルパー・ボタンの表示
  • 種類
  • 増分
  • プロンプト文字の表示
  • プロンプト文字
  • タイプ: パーセント (Type: Percent)
  • オプション
  • 整数のみ
  • ヘルパー・ボタンの表示
  • 種類
  • 増分
  • プロンプト文字の表示
  • プロンプト文字
  • タイプ: カスタム (Type: Custom)
  • オプション
  • パターン
  • ヘルパー・ボタンの表示
  • 種類
  • 増分
  • プロンプト文字の表示
  • プロンプト文字
「妥当性検査」タブ:
  • 値を必須にする
  • 単純妥当性検査の使用
  • 最小
  • 最大
  • 拡張妥当性検査の使用
  • 拡張妥当性検査式
  • 検証コードを作成/編集するには、ここをクリック (Click to create/edit validation code)
  • エラー・メッセージ・コントロールに検証エラー・メッセージを表示
「振る舞い」タブ:
  • コントロールを使用不可にする
  • コントロールを読み取り専用にする
  • 自動的に次のフィールドに進む
  • ユーザーが X 文字を入力後 (After user types X characters)
  • ブラウザーでフィールドを検証 (Validate field in the browser)
  • onblur アクション
  • onfocus アクション

日付/時刻

「h:inputText」タブ:
  • ID
  • スタイル: プロパティー
  • スタイル: クラス
  • サイズ: 幅
  • タイプ: 日付のみ (Type: Date Only)
  • オプション
  • 日付スタイル
  • ヘルパー・ボタンの表示
  • プロンプト文字の表示
  • プロンプト文字
  • タイプ: 時刻のみ (Type: Time Only)
  • オプション
  • 時刻スタイル
  • ヘルパー・ボタンの表示
  • 増分
  • プロンプト文字の表示
  • プロンプト文字
  • タイプ: 日付と時刻 (Type: Date and time)
  • オプション
  • 日付スタイル
  • 時刻スタイル
  • プロンプト文字の表示
  • プロンプト文字
「妥当性検査」タブ:
  • 値を必須にする
  • 単純妥当性検査の使用
  • 最小
  • 最大
  • 拡張妥当性検査の使用
  • 拡張妥当性検査式
  • 検証コードを作成/編集するには、ここをクリック (Click to create/edit validation code)
  • yyyy/dd/mm、hh:mm:ss、または now を使用。(Use yyyy/dd/mm or hh:mm:ss or now.)
  • エラー・メッセージ・コントロールに検証エラー・メッセージを表示
「振る舞い」タブ:
  • コントロールを使用不可にする
  • コントロールを読み取り専用にする
  • 自動的に次のフィールドに進む
  • ブラウザーでフィールドを検証 (Validate field in the browser)
  • onblur アクション
  • onfocus アクション

マスク

「h:inputText」タブ:
  • ID
  • スタイル: プロパティー
  • スタイル: クラス
  • サイズ: 幅
  • オプション
  • マスク
  • プロンプト文字の表示
  • プロンプト文字
「妥当性検査」タブ:
  • 値を必須にする
  • 最小長
  • 最大長
  • カスタム検証コードを作成/編集するには、ここをクリック
  • エラー・メッセージ・コントロールに検証エラー・メッセージを表示
「振る舞い」タブ:
  • コントロールを使用不可にする
  • コントロールを読み取り専用にする
  • 自動的に次のフィールドに進む
  • ユーザーが X 文字を入力後 (After user types X characters)
  • ブラウザーでフィールド値を検証
  • onblur アクション
  • onfocus アクション

「すべての属性」ビューには、コンポーネントで設定できるすべての属性の表が表示されます。 この表には、「プロパティー」ビューからアクセスできる属性も含まれます。 「すべての属性」ビューに切り替えるには、 「プロパティー」ビューの右上隅にある「すべての属性」アイ コン「すべての属性」
アイコンをクリックします。

表 3. すべての入力属性

属性名

「プロパティー」ビューでの表示

説明

accesskey

「アクセシビリティ」>「アクセス・キー」

アクセス・キーとして、単一のキーボード・キーを指定します。 実行時に指定されたアクセス・キーを押すと、 このコンポーネントがフォーカスされます。実行時に Alt (前面) キーと 指定されたアクセス・キーを押すと、 このコンポーネントがフォーカスされます (コンポーネントが ボタンの一種である場合は、そのコンポーネントが実行されます)。

alt

非表示

コンポーネントの代替テキストを指定します。 この代替テキストが表示されるのは、 要素が正常にレンダリングされない場合です。 例えば、ブラウザーがフォームをサポートしていない場合や、 ブラウザーがイメージを表示しないように 設定されている場合などです。

binding

非表示

コンポーネントの インスタンス (通常はユーザー・インターフェース・ コンポーネント) を、Bean プロパティー (通常は バッキング・ファイル内にあります) にバインドする式です。

converter

非表示

値の変換後のデータ型を指定します。 JavaServer Faces の実装によって、 コンポーネント・データをレンダラーがサポートしない型に変換する際に使用できる、 コンバーターの実装セットが提供されます。

dir

非表示

実行時にレンダリングされるときのコンポーネントの方向を指定します。 次のいずれかの値にできます。
  • ltr - 左から右
  • rtl - 右から左
方向を指定しない場合は、コンポーネントのエンコード方式に適している方向が使用されます。

disabled

「振る舞い」>「コントロールを使用不可にする」

disabled が true に設定されると、 コンポーネントは実行時に表示されますが、機能しません。 ブランクのままにした場合のデフォルト値は false です。

id

ID

コンポーネントに名前を割り当てます。JSP 内で固有の名前にする必要があります。

immediate

非表示

true にすると、ライフ・サイクルのレンダリング・フェーズまでスキップします。

lang

非表示

コンポーネントの値およびテキスト・コンテンツの言語。 省略されている場合、言語は含まれているタグ (特にビュー) から継承されます。これは、ISO 規格言語省略コードで指定します。例えば、英語は「en」、米国英語は「en-US」、 フランス語は「fr」、ドイツ語は「de」を使用します。
注: これは、コンポーネント内のテキストを変換するのではなく、検索、ソート、照合などの操作が正しく実行されるようにコンポーネントの言語を識別します。

maxlength

「振る舞い」>「ユーザーが X 文字を入力後 (After user types X characters)」

エンド・ユーザーがコンポーネントに指定の数の文字を 入力した後に、制御属性を設定します。

readonly

「振る舞い」>「コントロールを読み取り専用にする」

コンポーネントの値を、初期値から変更できなくさせるように指定します。

rendered

非表示

true または false に設定できます。
  • false - コンポーネントは、実行時にブラウザーにレンダリングされません。
  • true - コンポーネントがレンダリングされます。これはデフォルト値です。

required

「妥当性検査」>「値を必須にする」

コンポーネントを指定する必要があります。 これをチェックして、ユーザーからの値の入力を要求します。

size

サイズ: 幅

コンポーネントの初期幅を指定します。この値は文字数を参照します。

style

スタイル: プロパティー

コンポーネントに対して CSS スタイル情報を指定します (例えば、style="font-size : 8pt ; color : red")。 選択されたコンポーネントのプロパティー (例えば、フォントおよび色) を定義します。 これは手動で行うか、またはボタンをクリックして、 ウィンドウ内から必要なプロパティーを選択してください。

styleClass

スタイル: クラス

この要素がレンダリングされるときに適用される、 CSS スタイル・クラスのリスト (スペース区切り)。 この値は、生成されたマークアップの クラス属性として渡されなければなりません。 選択されたコンポーネントのクラス (例えば、スタイルシート) を定義します。 これは手動で行うか、またはボタンをクリックして、 ウィンドウ内から必要なクラスを選択してください。

tabindex

「アクセシビリティ」>「タブ順序インデックス」

JSP 内のタブ順序でコンポーネントの位置を指定します。 この値は、0 から 32767 までの数値でなければなりません。

title

「アクセシビリティ」>「タイトル」

実行時にツールチップとしてブラウザーに表示される、タイトル・テキストを指定します。 コンポーネントの代替テキストが指定されていない場合、 ブラウザーはこのテキストを代替テキストとして使用します。

validator

非表示

FacesContext、UIComponent、およびオブジェクト・パラメーターを受け入れるメソッド (MethodBinding 式で表現されます)。検証プロセスで呼び出され、コンポーネントの値が正しいことを確認します。

value

実行時に表示されるコンポーネントの初期テキスト値を指定します。 表示される情報が、指定された値または動的な値のポインターのフォームで組み込まれます。

valueChangeListener

非表示

コンポーネントの値が変更されたときに通知されるメソッド。

関連タスク
入力フィールドのカスタム・パターンの定義
Faces JSP ページへの入力コンポーネントの追加
関連資料
データ・テーブル
入力 - 非表示
入力 - パスワード
入力 - テキスト領域
ファイル・アップロード
リッチ・テキスト領域

フィードバック