メニュー・ポップアップから任意の処理を呼び出すことができないか、という相談がありました。メニュー・ポップアップは、Universal ThemeのリファレンスのMenu Popupで紹介されています。
メニュー・ポップアップでJOBを選択することで、表EMPのレポートをJOBごとに表示するような実装を試してみました。
以下より、実装について紹介します。
アプリケーション作成ウィザードを起動し、表EMPのクラシック・レポートを追加したアプリケーションを作成します。
アプリケーションが作成されたら、ページ・デザイナにてクラシック・レポートが実装されているページを開きます。
検索条件となるJOBを保持するページ・アイテムを作成します。
識別の名前はP1_JOB、タイプは非表示とします。JavaScriptで値を設定するため、設定の保護された値はOFFにします。
クラシック・レポートに検索条件を設定します。
ソースのWHERE句として以下を記述します。
:P1_JOB is null or JOB = :P1_JOB
送信するページ・アイテムにP1_JOBを指定します。
JavaScriptよりリージョンのリフレッシュを呼び出すため、詳細の静的IDとしてEMPを割り当てます。
共有コンポーネントのリストを開きます。
作成するリストの名前はジョブのリストとします。タイプに静的を選択します。
次へ進みます。
リスト・エントリ・ラベルとしてANALYST、CLERK、SALESMAN、MANAGER、PRESIDENTを指定し、ターゲット・ページIDまたはカスタムURLはすべて#を指定します。
表EMPの内容が日本語の場合は、リスト・エントリ・ラベルを日本語のJOBの内容にすることもできます。
次へ進みます。
リスト・リージョンを作成しますか。としてカレント・ページにリスト・リージョンを作成するを選択します。クラシック・レポートが作成されているページがカレント・ページであることを、右上のページの編集ボタンより確認します。リージョン位置はページ・テンプレート・ボディ、リージョン・テンプレートはBlack with Atrributes、リスト・テンプレートはMenu Popupを選びます。
リストの作成をクリックします。
リストジョブのリストが作成されます。
作成されたリストのリスト・エントリにアクションを紐づけるため、リストジョブのリストを開きます。
リスト・エントリの鉛筆アイコンをクリックします。
リスト・エントリのユーザー定義属性のセクションに移り、1. Menu Item ID / Action Nameにアクション名を設定します。リスト・エントリANALYSTにはselect-job-analystを設定します。
ページ・ロード時にここで指定した名前で、apex.actionsのアクションが作成されます。(テンプレート・オプションのAdd Actionsにチェックを入れる必要あり)
変更の適用をクリックします。
同様にして、それぞれのリスト・エントリにselect-job-clerk、select-job-salesman、select-job-manager、select-job-presidentを設定します。
ページ・デザイナに移り、作成されたリストのリージョンを選択します。
プロパティ・エディタで属性を開き、外観のテンプレート・オプションを開きます。
Add Actionsにチェックを入れます。
リストのリージョンに静的IDとしてselectjobを設定します。
メニュー・ポップアップを開くボタンを作成します。
識別のボタン名をSELECT_JOB、ラベルをSelect Jobとします。動作のアクションとして動的アクションで定義を選択します。
詳細のカスタム属性としてdata-menu="リスト・リージョンの静的ID_menu"を設定します。今回の実装ではリスト・リージョンに静的IDとしてselectjobを設定しているため、設定値は以下になります。
data-menu="selectjob_menu"
メニュー・ポップアップを開き、リスト・エントリが選択されたときに実行されるコードを記述します。
以下のコードをページ・プロパティのJavaScriptのページ・ロード時に実行に記述します。リストがロードされたときに作成されているアクションの属性actionに、実行されるコードを記述しています。
以上で実装は完了です。アプリケーションを実行すると、記事の先頭のGIF動画のように動作します。
今回作成したAPEXアプリケーションのエクスポートを以下に置きました。
https://github.com/ujnak/apexapps/blob/master/exports/menu-popup-with-action.zip
Oracle APEXのアプリケーション作成の参考になれば幸いです。
完