2023年7月13日木曜日

対話グリッドの行を事前に選択する

 対話グリッドが表示されるときに、事前に行を選択した状態にしたいとの相談がありました。サンプル・データセットの表EMPを使って、実装のサンプルを作ってみました。

以下のような動作になります。ジョブを指定して送信すると、再表示された対話グリッドでそのジョブの従業員の行が選択されます。

以下より実装について紹介します。

アプリケーション作成ウィザードを起動し、サンプルとなるアプリケーションを作成します。名前行の事前選択とします。

作成されているホーム・ページを削除し、表EMPをソースとした対話グリッドページを追加します。

対話グリッドのページはページ名EMP表またはビュー編集を許可を選択し、表またはビューとしてEMPを選択します。

以上でアプリケーションの作成を実行します。

アプリケーションが作成されたら、ページ・デザイナにて対話グリッドが実装されているページを開きます。

ジョブを指定するページ・アイテムを作成します。

識別名前P1_JOBタイプテキスト・フィールドラベルJobとします。

設定[Enter]を押すと送信オンにし、ジョブに文字列を入れてEnterを押したときに、ページが送信されて再表示されるようにします。

JavaScriptのコードから対話グリッドを呼び出すために、詳細静的IDとしてempを設定します。

対話グリッドの属性を開き、パフォーマンス遅延ロードオンにします。いくつかのイベントは、遅延ロードがオンのときに限り発生します。また、外観最初の行の選択オフにします。


ページ・アイテムP1_JOBの値に応じて選択される行を返すAjaxコールバックのプロセスを作成します。

識別名前GET_SELECT_RECORDSタイプコードの実行です。ソースPL/SQLコードとして以下を記述します。

ジョブの文字列を受け取り、対話グリッド上で選択する行を従業員番号(EMPNO)の配列にして { selectRecords : [ "7823", "7923", ... ] } というJSONドキュメントを返します。


対話グリッドに動的アクションを作成します。

識別名前対話グリッドの行の選択とします。

タイミングイベントページの変更[対話グリッド]選択タイプリージョンリージョンEmployeesになります。


TRUEアクションとしてJavaScriptコードの実行を選択し、設定コードとして以下を記述します。


以上でサンプルの実装は完了です。

アプリケーションを実行すると、記事の先頭のGIF動画のように動作します。

今回作成したAPEXアプリケーションのエクスポートを以下に置きました。
https://github.com/ujnak/apexapps/blob/master/exports/ig-preselect-rows.zip

Oracle APEXのアプリケーション作成の参考になれば幸いです。