| Oracle® Fusion Middleware Oracle Application Development Framework Webユーザー・インタフェース開発者ガイド 11g リリース1 (11.1.1.6.0) B52029-06 |
|
 前 |
 次 |
| Oracle® Fusion Middleware Oracle Application Development Framework Webユーザー・インタフェース開発者ガイド 11g リリース1 (11.1.1.6.0) B52029-06 |
|
前 |
次 |
この章では、値リスト・コンポーネントを使用して、ユーザーが値を選択できるオブジェクトのモデルドリブン・リストを表示する方法を説明します。
この章では、次の項目について説明します。
ADF Facesには、各リスト項目の複数の属性が表示でき、ユーザーがオプションで必要な項目を検索できる値リスト(LOV)入力コンポーネントが2つあります。このLOVコンポーネントは、あるオブジェクトの属性の移入に使用されるフィールドが、実際はデータベースの外部キー関係のように他のオブジェクトのリスト内に含まれる場合に有用です。たとえば、ユーザーが従業員情報を編集できるフォームがあるとします。ユーザーがまず編集する従業員レコードを探す必要のある別のページを用意するかわりに、図11-1に示すように、その検索および選択機能をフォームに組み込むことができます。
このフォームにおいて、従業員名フィールドは従業員のリストが含まれるLOVです。ユーザーがinputListOfValuesコンポーネントの検索アイコンをクリックすると、図11-2に示すように、「検索および選択」ポップアップ・ダイアログに、ユーザーが従業員を検索できる検索フィールドとともにすべての従業員が表示されます。
ユーザーがページに戻ると、図11-3に示すように、その従業員の現在の情報がフォームに表示されます。ユーザーは、データを編集して保存できます。
selectOneChoiceなど、その他のリスト・コンポーネントでも、ユーザーはリストから選択できますが、ポップアップ・ダイアログは含まれず、小規模なリストを対象としています。この章で説明するのは、inputListOfValuesおよびinputComboboxListOfValues LOVコンポーネントのみです。選択コンポーネント、リスト・ボックス・コンポーネントおよびラジオ・ボタンの詳細は、第9章「入力コンポーネントの使用およびフォームの定義」を参照してください。
前述の図に示したように、inputListOfValuesコンポーネントでは、ユーザーが項目を検索して選択できるポップアップ・ダイアログが提供されます。リストは表に表示されます。これに対し、inputComboboxListOfValuesコンポーネントでは、単純なドロップダウン・リストから選択する方法と、inputListOfValuesコンポーネントでできるのと同じ検索方法の2種類の方法で、入力する項目を選択できます。表の列はダイアログの全幅に合せて拡大しません。
searchContentファセットを使用することにより、「検索および選択」ダイアログでレンダリングされるカスタム・コンテンツを作成することもできます。returnPopupDataValue属性を定義し、ユーザーが「検索および選択」ダイアログから項目を選択して、ダイアログを閉じるときの値を使用して、プログラムで設定します。この値は、ReturnPopupEventからreturnPopupListenerの戻り値になります。returnPopupListenerを実装すると、LOVコンポーネント、その依存コンポーネントの値の設定、カスタム・コンテンツの表示などの関数を実行できます。searchContentファセットでは、表、ツリー、inputTextなどのコンポーネントを追加して、カスタム・コンテンツを表示できます。
searchContentファセットとListOfValuesモデルの両方を実装すると、「検索および選択」ダイアログでのレンダリングでsearchContentファセットの実装が優先されます。例11-1に、表コンポーネントを使用してカスタム・コンテンツを表示するためのコードを示します。
例11-1 「検索および選択」ダイアログへのカスタム・コンテンツの追加
<af:inputListOfValues model="#{bean.listOfValuesModel}"
...
returnPopupDataValue="#{bean.returnPopupDataValue}"
returnPopupListener="#{bean.returnPopupListener}">
<f:facet name="searchContent">
<af:table id="t1" value="#{bean.listModel}" var="row"
selectionListener="#{bean.selected}"
...
</f:facet>
</af:inputListOfValues>
readOnly属性がtrueに設定されている場合、入力フィールドは無効になります。readOnlyがfalseに設定されている場合は、どのタイプの入力が許可されるかをeditMode属性で決定します。editModeがselectに設定されている場合は、リストから値を選択する方法でしか値を入力できません。editModeがinputに設定されている場合は、値をタイプして入力することもできます。
LOVコンポーネントを実装すると、ユーザーが値の一部を入力したときに提案される項目のリストを自動的に表示することもできます。たとえば、ユーザーがCaを入力すると、図11-4に示すように、Caに部分的に一致する提案リストが提案項目のリストとして表示されます。
図11-5に示すように、ユーザーはこのリストから項目を選択して、入力フィールドに入力できます。
af:autoSuggestBehaviorタグをLOVコンポーネント内部に追加し、タグのsuggestItems値を、リストを取得して表示するメソッドに設定して、自動提案動作を追加します。このメソッドはマネージドBeanで作成できます。ADFモデルを使用している場合、このメソッドはデフォルトで実装されます。コンポーネントのautoSubmitプロパティをtrueに設定する必要もあります。
LOVモデルの実装では、リストをさらにフィルタするスマート・リストを実装できます。スマート・リストは両方のLOVコンポーネントで実装できます。ADFモデルを使用している場合は、そのLOVのビュー基準として定義されたスマート・リスト・フィルタをinputComboboxListOfValuesで宣言的に選択できます。スマート・リストが実装されており、自動提案動作も使用されている場合、自動提案ではスマート・リストから最初に検索されます。ユーザーが何もせずに2秒待機すると、自動提案は完全なリストからも検索して結果を追加します。maxSuggestedItems属性では、返す項目の数(-1は完全なリストを示します)を指定します。maxSuggestedItems > 0の場合は、ユーザーがクリックしてLOVの検索および選択ダイアログを起動できるように、「次へ」リンクがレンダリングされます。例11-2に、自動提案動作およびスマート・リストの両方を含むLOVコンポーネントのコードを示します。
例11-2 自動提案動作およびスマート・リスト
<af:autoSuggestBehavior
suggestItems="#{bean.suggestItems}"
smartList="#{bean.smartList}"
maxSuggestedItems="7"/>
図11-6に、リストがinputComboboxListOfValuesコンポーネントによってどのように表示されるかを示します。ポップアップ・ダイアログに問合せパネルが含まれている場合は、「検索」リンクがドロップダウン・リストの下部に表示されます。問合せパネルが使用されていない場合は、「次へ」リンクが表示されます。
inputComboboxListOfValuesコンポーネントのドロップダウン・リストには、次の内容を表示できます。
完全なリスト: 図11-6に示したように、ListOfValuesModel.getItems()メソッドにより項目の完全なリストが戻されます。
お気に入りリスト: ListOfValuesModel.getRecentItems()メソッドにより、最近選択された項目のリストが戻されます。
検索リンク: ポップアップの「検索および選択」ダイアログが開かれるリンク。リンクは、ドロップダウン・リストのスクロール可能なリージョンにはありません。
customActionsファセット: その他のコンテンツを追加するためのファセット。通常、1つ以上のcommandLinkコンポーネントが含まれます。ポップアップ・ダイアログの起動など、目的のアクションを実行するには、commandLinkにロジックを実装してください。
行ごとに表示する列の数は、getItemDescriptors()メソッドを使用して、モデルから取得できます。デフォルトではすべての列が表示されます。
inputListOfValuesコンポーネントのポップアップ・ダイアログや、inputComboboxListOfValuesコンポーネントのオプションの検索ポップアップ・ダイアログにも、新規レコードを作成する機能があります。inputListOfValuesコンポーネントの場合、コンポーネントにcreatePopupId属性が設定されていると、commandToolbarButtonを含むtoolbarコンポーネントが作成アイコンとともに表示されます。図11-7に示すように、実行時に、LOVポップアップ・ダイアログにcommandToolbarButtonコンポーネントが表示されます。
ユーザーが「作成」ボタンをクリックすると、新規レコードの作成に使用できるポップアップ・ダイアログが表示されます。inputComboboxListOfValuesの場合は、ツールバーではなく、ダイアログ下部のcustomActionsファセットに「作成」というラベルのcommandLinkが表示されます。このリンクにより、ユーザーが新規レコードを作成できるポップアップが起動されます。どちらの場合も、実際に新規レコードを作成するためのコードを入力する必要があります。
|
ヒント: 独自の作成機能を作成するかわりに、ADF Business ComponentsおよびADFデータ・バインディングを使用できます。詳細は、『Oracle Fusion Middleware Oracle Application Development Framework Fusion開発者ガイド』の「入力表の作成」を参照してください。 |
問合せコンポーネント同様、LOVコンポーネントもデータ・モデルに依存して機能を提供しています。このデータ・モデルはListOfValuesModelクラスです。このモデルでは、値リストの表示に表モデルが使用され、問合せモデルにアクセスしてリストの検索を実行することも可能です。LOVコンポーネントを使用するには、指定されたインタフェースをListOfValuesModelに実装する必要があります。
|
ヒント: 独自の |
ユーザーがドリストで項目を選択すると、データは選択された行(各オブジェクトは選択した行のrowDataになります)のオブジェクトのリストとして返されます。オブジェクトのリストは、選択された後キューされるReturnPopupEventで入手できます。
QueryModelクラスも実装する場合は、ユーザーが検索の実行やリストのフィルタ処理に使用できるQueryコンポーネントがポップアップ・ダイアログに含まれます。LOVポップアップ・ダイアログでのQueryコンポーネントの使用に関して、次の点に注意してください。
保存済検索機能はサポートされていません。
ポップアップ・ダイアログのQueryコンポーネントとその機能は、対応するQueryDescriptorクラスに基づいています。
LOVポップアップ・ダイアログに含めることのできるコンポーネントは、query、toolbarおよびtableのみです。
ユーザーが「検索」ボタンをクリックして検索を開始すると、ListOfValuesModel.performQuery()メソッドが起動され、検索が実行されます。問合せモデルの詳細は、第12章「問合せコンポーネントの使用方法」を参照してください。
どちらのコンポーネントでも、オートコンプリート機能がサポートされているため、ユーザーが値の一部を入力フィールドに入力し、[Tab]を使用してフィールドから移動すると、条件の一部に一致する行がダイアログに移入されます。これを機能させるには、ユーザーが一部を入力した後に[Tab]を使用してフィールドから移動した場合に、入力した値がサーバーに戻されるロジックを実装する必要があります。サーバーでは、モデル実装により、部分的に入力された値を使用してリストがフィルタ処理され、値リストを取得する問合せが実行されます。ADF Facesには、この機能のためのAPIが用意されています。
LOVコンポーネントを使用するには、ADF FacesのAPIを使用してLOV機能にアクセスするデータ・モデルが必要です。図11-8に、ListOfValuesモデルのクラス図を示します。
ListOfValuesモデルおよび関連するイベントを作成する手順:
図11-8に示す各インタフェース・クラスの実装を作成します。表11-1にAPIを説明します。
表11-1 ListOfValuesモデルのAPI
| メソッド | 機能 |
|---|---|
|
|
コンポーネントで |
|
|
値が「検索および選択」ダイアログから選択されて、「OK」ボタンがクリックされた場合にコールされます。このメソッドにより、モデルは選択された値に基づいてモデルを更新できます。 |
|
|
オートコンプリートを有効化するかどうかを決定するためにブールが戻されます。 |
|
|
|
|
|
コンボボックス・ドロップダウンに表示する |
|
|
|
|
|
「検索および選択」ダイアログに作成される |
|
|
|
ListOfValuesモデルの例については、ADF FacesアプリケーションのApplication Sourcesディレクトリにある、oracle.adfdemo.view.lovパッケージのDemoLOVBeanおよびDemoComboboxLOVBeanクラスを参照してください。
inputListOfValuesコンポーネントの場合は、リストの移入に使用された属性にアクセスするマネージドBean(LOVモデルの作成に使用されたものと同じマネージドBeanでもかまいません)にロジックを指定します。inputComboboxListOfValuesコンポーネントでは、getItems()およびgetRecentItems()メソッドを使用してリストが戻されます。
InputListOfValuesコンポーネントに使用される「検索および選択」ポップアップ・ダイアログの場合、またはInputComboboxListOfValuesコンポーネントに「検索および選択」ポップアップ・ダイアログを使用する場合は、ListOfValuesModel.autoCompleteValue()およびListOfValuesModel.valueSelected()メソッドを実装します。これらのメソッドによりポップアップ・ダイアログが開かれ、コンポーネントに選択された値が適用されます。
inputListOfValuesコンポーネントでは、11.2項「ListOfValuesデータ・モデルの作成」に記載されているように、項目のリストにアクセスするために実装したListOfValuesモデルが使用されます。
作業を始める前に、次のようにします。
ページまたはページ・フラグメントをすでに作成している必要があります。モデルに検索APIも実装すると、コンポーネントでは、ユーザーがリスト内の値を検索することもできるようになります。
inputListOfValuesコンポーネントを追加する手順:
コンポーネント・パレットの「共通」パネルから、ページに「入力値リスト」コンポーネントをドラッグ・アンド・ドロップします。
プロパティ・インスペクタで、「共通」セクションを開いて次の属性を設定します。
model: 11.2項「ListOfValuesデータ・モデルの作成」で作成した、ListOfValuesModel実装に解決されるEL式を入力します。
value: 11.2項「ListOfValuesデータ・モデルの作成」で作成した、リストへの移入に使用された属性値に解決されるEL式を入力します。
「外観」セクションを開き、次の属性値を設定します。
popupTitle: 「検索および選択」ポップアップ・ダイアログのタイトルを指定します。
searchDesc: マウスが置かれた際にコンポーネントのヒントとして表示するテキストを入力します。
このセクションの残りの属性は、その他の入力コンポーネントと同じ方法で移入できます。詳細は、9.3項「inputTextコンポーネントの使用方法」を参照してください。
「動作」セクションを開き、次の属性値を設定します。
autoSubmit: 該当するアクション(クリックやテキストの変更など)が実行された場合に、含まれているフォームがコンポーネントにより自動的に送信されるようにするにはtrueに設定します。これにより、オートコンプリートが機能します。自動提案動作を追加している場合は、autoSubmitをtrueに設定する必要があります。
createPopupId: リストに新規オブジェクトを作成するために使用されたポップアップ・ダイアログを実装した場合は、そのポップアップ・コンポーネントのIDを指定します。これにより、定義したポップアップ・ダイアログにバインドされたcommandToolbarButtonコンポーネントを含む表の上にtoolbarコンポーネントが表示されます。ポップアップにダイアログを追加した場合は、表をリフレッシュするタイミングが自動的に決定されます。ポップアップにダイアログを追加しなかった場合、表は常にリフレッシュされます。
launchPopupListener: ポップアップの起動時に追加の機能を提供するために実装するlaunchPopupListenerに解決されるEL式を入力します。
returnPopupListener: 値が戻された場合に追加の機能を提供するために実装するreturnPopupListenerコンポーネントに解決されるEL式を入力します。
このセクションの残りの属性は、その他の入力コンポーネントと同じ方法で移入できます。詳細は、9.3項「inputTextコンポーネントの使用方法」を参照してください。
ユーザーが新しい項目を作成できるようにする場合は、手順4で指定されたIDを使用してポップアップ・ダイアログを作成します。詳細は、第13章「ポップアップ・ダイアログ、メニューおよびウィンドウの使用方法」を参照してください。
コンポーネント・パレットの「操作」パネルから、「自動提案動作」をinputListOfValuesコンポーネントの子としてドラッグ・アンド・ドロップします。
プロパティ・インスペクタで、自動提案属性ごとに次を入力します。
suggestItemsメソッドに解決するEL式。
このメソッドでは、suggestItemsのList<javax.model.SelectItem>を返します。メソッド・シグネチャの書式はList<javax.model.SelectItem> suggestItems(javax.faces.context.FacesContext, oracle.adf.view.rich.model.AutoSuggestUIHints)にする必要があります。
smartListメソッドに解決するEL式。このメソッドでは、スマート・リスト項目のList<javax.model.SelectItem>を返します。
自動提案リストに表示する項目の数。完全なリストを表示するには-1を入力します。
このメソッドをマネージドBeanで実装している場合は、例11-3に示す書式をJSFページのエントリに含める必要があります。
例11-3 LOVのautoSuggestBehaviorタグ
<af:inputListOfValues value="#{bean.value}" id="inputId">
...
<af:autoSuggestBehavior
suggestItems="#{bean.suggestItems}"
smartList="#{bean.smartList}"
maxSuggestedItems="7"/>
</af:inputListOfValues>
コンポーネントがADFモデルなどのデータ・モデルで使用されている場合は、suggestItem メソッドをデフォルトの実装で指定する必要があります。
ADFモデルを使用していない場合は、suggestItemsメソッドを作成して、リストを処理および表示します。suggestItemsメソッド・シグネチャは、例11-4に示されています。
inputComboboxListOfValuesコンポーネントを使用すると、ユーザーはドロップダウン・リストから値を選択し、inputListOfValuesコンポーネントと同じように、ページのLOVフィールドおよび可能な場合はその他のフィールドに移入できます。ただし、リストの値を完全なリストとして表示することや、最近参照した値ごとに表示することも可能になります。問合せAPIを実装していれば、11.2項「ListOfValuesデータ・モデルの作成」で説明されているように、ポップアップ・ダイアログで検索を実行するようにコンポーネントを構成することもできます。
作業を始める前に、次のようにします。
ページまたはページ・フラグメントをすでに作成している必要があります。
inputComboboxListOfValuesコンポーネントを追加する手順:
コンポーネント・パレットの「共通」パネルから、ページに値の入力コンボボックス・リストをドラッグ・アンド・ドロップします。
プロパティ・インスペクタで、「共通」セクションを開いて次の属性を設定します。
model: 11.2項「ListOfValuesデータ・モデルの作成」で作成した、ListOfValuesModel実装に解決されるEL式を入力します。
value: 11.2項「ListOfValuesデータ・モデルの作成」で作成した、リストへの移入に使用された属性値に解決されるEL式を入力します。
「外観」セクションを開き、次の属性値を設定します。
popupTitle: 「検索および選択」ポップアップ・ダイアログのタイトルを指定します。
searchDesc: マウスが置かれた際にコンポーネントのヒントとして表示するテキストを入力します。
このセクションの残りの属性は、その他の入力コンポーネントと同じ方法で移入できます。詳細は、9.3項「inputTextコンポーネントの使用方法」を参照してください。
「動作」セクションを開き、次の属性値を設定します。
autoSubmit: 該当するアクション(クリックやテキストの変更など)が実行された場合に、含まれているフォームがコンポーネントにより自動的に送信されるようにするにはtrueに設定します。これにより、オートコンプリートが機能します。自動提案動作を追加している場合は、autoSubmitをtrueに設定する必要があります。
createPopupId: リストに新規オブジェクトを作成するために使用されたポップアップ・ダイアログを実装した場合は、そのポップアップ・コンポーネントのIDを指定します。これにより、定義したダイアログにバインドされたcommandToolbarButtonコンポーネントを含む表の上にtoolbarコンポーネントが表示されます。ポップアップにダイアログを追加した場合は、表をリフレッシュするタイミングが自動的に決定されます。ポップアップにダイアログを追加しなかった場合、表は常にリフレッシュされます。
launchPopupListener: ポップアップ・ダイアログが開かれる際に追加の機能を提供するために実装するlaunchPopupListenerハンドラに解決されるEL式を入力します。
returnPopupListener: 値が戻された場合に追加の機能を提供するために実装するreturnPopupListenerハンドラに解決されるEL式を入力します。
このセクションの残りの属性は、その他の入力コンポーネントと同じ方法で移入できます。詳細は、9.3項「inputTextコンポーネントの使用方法」を参照してください。
launchPopupListenerを使用している場合は、LaunchPopupEventクラスのgetPopupType()メソッドを使用して、イベントのソースを区別できます。イベントがLOV検索および選択ダイアログの起動の結果の場合は、getPopupType()によってDROPDOWN_LISTが返され、イベントがダイアログの「検索」ボタンをユーザーがクリックした結果の場合は、SEARCH_DIALOGが返されます。
ユーザーが新しい項目を作成できるようにする場合は、手順5で指定されたIDを使用してポップアップ・ダイアログを作成します。詳細は、第13章「ポップアップ・ダイアログ、メニューおよびウィンドウの使用方法」を参照してください。
コンポーネント・パレットの「操作」パネルから、「自動提案動作」をinputComboboxListOfValuesコンポーネンの子としてにドラッグ・アンド・ドロップします。
プロパティ・インスペクタで、自動提案属性ごとに次を入力します。
suggestItemsメソッドに解決するEL式。
このメソッドでは、suggestItemsのList<javax.model.SelectItem>を返します。メソッド・シグネチャの書式はList<javax.model.SelectItem> suggestItems(javax.faces.context.FacesContext, oracle.adf.view.rich.model.AutoSuggestUIHints)にする必要があります。
smartListメソッドに解決するEL式。このメソッドでは、スマート・リスト項目のList<javax.model.SelectItem>を返します。
自動提案リストに表示する項目の数。完全なリストを表示するには-1を入力します。
このメソッドをマネージドBeanで実装している場合は、例11-5に示す書式をJSFページのエントリに含める必要があります。
例11-5 LOVのautoSuggestBehaviorタグ
<af:inputComboboxListOfValues value="#{bean.value}" id="inputId">
...
<af:autoSuggestBehavior
suggestItems="#{bean.suggestItems}"
smartList="#{bean.smartList}"
maxSuggestedItems="7"/>
</af:inputComboboxListOfValues>
コンポーネントがADFモデルなどのデータ・モデルで使用されている場合は、suggestItem メソッドをデフォルトの実装で指定する必要があります。
ADFモデルでコンポーネントを使用していない場合は、suggestItemsメソッドを作成して、リストを処理および表示します。suggestItemsメソッド・シグネチャは、例11-6に示されています。
