6.4 ダイアログ・ページの作成

Oracle APEXには、モーダルおよび非モーダル・ダイアログ・ページに対するサポートが提供されています。モーダルまたは非モーダル・ダイアログ・ページは、テンプレート・タイプが「ダイアログ・ページ」のページ・テンプレートが、カレント・アプリケーション・テーマに1つ以上含まれている場合にのみサポートされます。

• サポートされるダイアログについて
  
• ダイアログ・ページ・テンプレートの使用
  
• ページ・デザイナでのダイアログ・ページの定義
  
• ダイアログ・ページでの「ダイアログを取り消す」動的アクションの生成
  
• ダイアログ・ページでの「ダイアログを閉じる」ページ・プロセスの生成
  
• ダイアログ・ページでのブランチングについて
  
• 親ページでのリフレッシュ・アクションの処理
  

6.4.1 サポートされるダイアログについて

新しいページを作成するときに、ウィザードによって、ページ・モードを選択するプロンプトが表示されます。ページ・モードによって、ページが標準アプリケーション・ページであるかダイアログ・ページであるかが決まります。Oracle APEXでは、次の2つのタイプのダイアログ・ページをサポートしています。

• モーダル・ダイアログ: モーダル・ダイアログは、同じブラウザ・ウィンドウ内に配置されるオーバーレイ・ウィンドウです。モーダル・ダイアログは、ユーザーが終了して閉じるまで、アクティブでフォーカスされたままです。モーダル・ダイアログがアクティブである間は、ダイアログを閉じるまでユーザーは残りのページと対話できません。
• 非モーダル・ダイアログ - 非モーダル・ダイアログは、個別のポップアップ・ブラウザ・ウィンドウを表示します。ユーザーは、非モーダル・ダイアログおよびページのコンテンツと対話できます。リクエストされる情報が続行に必要でない場合に、非モーダル・ダイアログを使用します。このウィンドウ・タイプは、別の場所で作業が続いている間、開いたままにできます。

6.4.2 ダイアログ・ページ・テンプレートの使用

Oracle APEXでは、ユニバーサル・テーマ - 42にダイアログ・ページ・テンプレートが含まれています。「ページ・モード」を「モーダル」または「非モーダル」に設定すると、APEXは自動的にデフォルトのダイアログ・ページ・テンプレートを使用します。この項では、テーマにダイアログ・テンプレートが含まれていない場合にそれを作成する方法と、ダイアログ・テンプレート属性を編集する方法について説明します。

• ダイアログ・ページ・テンプレートの作成
  
• ダイアログ・ページ・テンプレート属性の定義について
  

6.4.2.1 ダイアログ・ページ・テンプレートの作成

既存のアプリケーションを使用し、テーマにダイアログ・ページ・テンプレートが含まれない場合は、ダイアログ・ページ・テンプレートを作成する必要があります。最初から作成できますが、最も簡単な方法は既存のダイアログ・テンプレートをコピーすることです。

ダイアログ・ページ・テンプレートを作成するには:

1. 「共有コンポーネント」、「テンプレート」ページにナビゲートします。
   1. ワークスペースのホームページで、「アプリケーション・ビルダー」アイコンをクリックします。
   2. アプリケーションを選択します。
   3. 「共有コンポーネント」をクリックします。
   4. 「ユーザー・インタフェース」で、「テンプレート」を選択します。
2. 「作成」をクリックします。
3. テンプレートの作成ウィザードで、次の手順を実行します。
   1. テンプレート・タイプ - 「ページ」を選択して、「次へ」をクリックします。
   2. 作成方法 - 「既存のテンプレートのコピーとして」を選択して、「次へ」をクリックします。
   3. コピー元 - コピー元のアプリケーションを選択し、「次」をクリックします。
   4. テーマの指定 - コピー元のテーマおよびコピー先のテーマを選択して、「次へ」をクリックします。
   5. 新規テンプレート - 「モーダル・ダイアログ」テンプレートを探します。「コピー」で、「はい」を選択します。
   6. 「ページ・テンプレートのコピー」を選択します。
4. ダイアログ・ページ・テンプレートがカレント・テーマでアクティブになっていることを確認します

関連項目:

デフォルトのページ・テンプレートの選択

6.4.2.2 ダイアログ・ページ・テンプレート属性の定義について

ダイアログ・ページ・テンプレートには、ダイアログ・ページの初期化、クローズおよび取消を処理するJavaScriptファンクション・コールが含まれています。ダイアログ・ページ・テンプレートを作成する場合は、こうしたダイアログ・ページ・テンプレートの属性を定義する必要があります。

関連項目:

必須のダイアログ・ページ・テンプレート属性

6.4.3 ページ・デザイナでのダイアログ・ページの定義

ページ・デザイナでダイアログとしてページを定義するには:

1. ページ・デザイナでページを表示します。
   1. ワークスペースのホームページで、「アプリケーション・ビルダー」アイコンをクリックします。
   2. アプリケーションを選択します。
   3. ページを選択します。
   ページ・デザイナが表示されます。属性は、グループに編成されます。
2. ページ・デザイナで「外観」グループを見つけます。
3. 「ページ・モード」で、次のいずれかを選択します。
   • モーダル・ダイアログ - ページはモーダル・ダイアログとして表示されます。モーダル・ダイアログは、ビューポート内に配置されたオーバーレイ・ウィンドウで、エンド・ユーザーが終了する(閉じる)までアクティブでフォーカスされたままです。基になるページはグレーアウトされ、ダイアログを閉じるまで、エンド・ユーザーは残りのページと対話できません。
   • 非モーダル・ダイアログ - ページは非モーダル・ダイアログとして表示されます。非モーダル・ダイアログはビューポート内に配置されたオーバーレイ・ウィンドウであり、エンド・ユーザーはこれを使用してダイアログおよびダイアログを起動したページのコンテンツと対話できます。非モーダル・ダイアログは、リクエストされる情報が続行するために必要な情報ではなく、ウィンドウが開いたままでも別の場所で作業を続行できる場合に使用できます。
4. 必要に応じて他の「外観」属性を編集します。

   ヒント:

   属性についてさらに学習するには、フィールドレベル・ヘルプを参照してください。

5. 「ダイアログ」で、適切な属性を編集します。
   1. 幅 - ダイアログの幅をピクセル単位または比率で入力します。ページ・テンプレートのダイアログ初期化コード内の置換文字列#DIALOG_WIDTH#は、このアイテムに入力した値で置換されます。デスクトップ・ユーザー・インタフェースを使用しているページの場合、値は500などのピクセル単位で設定します。
   2. 高さ - ダイアログの高さをピクセル単位で入力します(たとえば、500)。ページ・テンプレートのダイアログ初期化コード内の置換文字列#DIALOG_HEIGHT#は、入力した値で置換されます。
   3. 最大幅 - ダイアログの最大幅をピクセル単位で入力します。ページ・テンプレートのダイアログ初期化コード内の置換文字列#DIALOG_MAX_WIDTH#は、このアイテムに入力した値で置換されます。
   4. 属性 - ダイアログのサポートはページのユーザー・インタフェースによって異なります。高さ、幅および最大幅など、ダイアログ属性のサブセットは宣言的にサポートされます。ダイアログの追加属性を定義するには、名前/値のペアをカンマ区切りリストに入力します。ページ・テンプレート・レベルで定義されたダイアログ初期化コード内の置換文字列#DIALOG_ATTRIBUTES#は、このアイテムに入力された任意の値で置換されます。
   5. CSSクラス - このコンポーネントに追加するクラスを入力します。複数のクラスは空白で区切って追加できます。
   6. チェーン: このダイアログが別のダイアログによって開かれ、同じダイアログ・ウィンドウを再利用する場合、「オン」を選択します。たとえば、このダイアログが複数ページ・ダイアログ・ウィザードの一部で、ウィザードの各ステップにダイアログ・ウィンドウを再利用する場合です。このダイアログが別のダイアログによって開かれ、新規ダイアログ・ウィンドウで開かれる必要がある場合、「オフ」を選択します。たとえば、このダイアログがモーダルで、親モーダル・ダイアログ・ウィンドウ内で開く場合です。
6. 変更内容を保存するには、保存をクリックします。

6.4.4 ダイアログ・ページでの「ダイアログを取り消す」動的アクションの生成

ダイアログ・ページに「取消」ボタンが含まれる場合は、そのボタンのクリックに基づいた動的アクションを生成し、その「Trueアクション」イベントを「ダイアログを取り消す」に設定する必要があります。この動的アクションは、ページ・テンプレート(apex.navigation.dialog.cancel)に含まれる取消しのJavaScriptコールを使用して、ダイアログの取消しを処理します。

関連項目:

動的アクションの管理

6.4.5 ダイアログ・ページでの「ダイアログを閉じる」ページ・プロセスの生成

「ダイアログを閉じる」ページ・プロセスを作成することによって、Oracle APEXでダイアログ・ページを閉じます。以前のリリースでは、このページ・プロセスは「ポップアップ・ウィンドウを閉じる」と呼ばれていました。このダイアログは、ページ・テンプレート(apex.navigation.dialog.close)に含まれるクローズのJavaScriptコールを使用して、ダイアログのクローズを処理します。ページ・プロセスは、親ページで参照することがあるダイアログ・ページ・アイテムの戻りもサポートしています。

ヒント:

「ダイアログを閉じる」動的アクションでダイアログ・ページを閉じることもできます。動的アクションとプロセスの両方が、ダイアログ・ページ・アイテムの戻りをサポートしています。ページを送信する必要がある場合はページ・プロセスを使用し、ページを送信する必要がない場合は動的アクションを使用します。両方とも、最終的にはクローズのJavaScriptコールをコールします。または、ダイアログ・ページを閉じて、ブランチで指定したページにリダイレクトするページ・ブランチを作成できます。

関連項目:

• ページ・プロセスの理解
• ブランチを使用したナビゲーションの制御

6.4.6 ダイアログ・ページでのブランチングについて

ダイアログ・ページを開くには、ボタンまたはリンクを使用します。ダイアログ・ページでは、次のブランチング・オプションがサポートされています。

• ダイアログ・ページからダイアログ・ページへの場合。

  1つのダイアログ・ページから別のダイアログ・ページに、ブランチできます。

  • どちらのページもページ・モードは同じです。たとえば、「モーダル・ダイアログ」ページと、ダイアログの「チェーン」属性が「オン」に設定されているページです。「チェーン」属性を「オン」に設定すると、多くの内部APEXウィザードで表示されるダイアログなど、チェーン・ダイアログまたはネスト・ダイアログがサポートされます。チェーンまたはネスト・ダイアログを使用すると、ダイアログ・ウィンドウを再度利用して各ページを表示できます。
• ダイアログ・ページから標準・ページの場合。
  • ダイアログ・ページから標準・ページにブランチすると、ダイアログが閉じられ、ユーザーはブラウザ内の新しいページに移動します。新しいページは、親(または起動)ページ、もしくはアプリケーション内の別の標準ページです。

6.4.7 親ページでのリフレッシュ・アクションの処理

ダイアログ・ページで「ダイアログを閉じる」ページ・プロセスを生成した場合、新しい「ダイアログのクローズ」動的アクション・イベント・タイプを使用して、親ページにリフレッシュ・アクションを実装する必要があります。「値の設定」のTrueアクションを作成するとき、タイプ設定「ダイアログ戻りアイテム」を使用し、ダイアログの戻りアイテムに基づいて単一の値が設定されるようにできます。

ヒント:

親ページの部分ページ・リフレッシュを行う場合は、ダイアログを閉じるときの動的アクションを実装します(たとえば、レポート・ページおよびフォーム・ページのデータをモーダル・ダイアログ・フォームで編集し、閉じるときにのみレポートがリフレッシュされるようにする場合)。対照的に、マルチ・ステップのモーダル・ウィザードがある場合や、ダイアログを閉じるときに可能なターゲットページが複数ある場合は、ブランチ処理が最適な方法となります。

関連項目:

動的アクションの管理