プライマリ・コンテンツに移動
Oracle® Application Expressアプリケーション・ビルダー・ユーザーズ・ガイド
リリース5.1
E83810-03
目次へ移動
目次
索引へ移動
索引

前
次

13.4 動的アクションの管理

動的アクションにより、開発者は、JavaScriptを必要としないで複雑なクライアント側の動作を宣言的に定義できます。

トピック:

13.4.1 動的アクションについて

動的アクションは、JavaScriptを必要としないで複雑なクライアント側の動作を宣言的に定義する方法を提供します。動的アクションの作成ウィザードを使用して、定義された条件セットが発生したときに実行されるアクションを指定します。また、アクションの影響を受ける要素や、影響を受ける時期と影響も指定できます。

動的アクションを使用するとき、ページに追加する動的アクションが多くなるほど全体のページ・サイズが大きくなることに注意する必要があります。これは、動的アクション・フレームワークでは、定義された各動的アクションについてクライアントへの追加コードを生成し、そのコードはクライアント内のフレームワークによってダウンロードおよび実行される必要があるためです。問題をデバッグする方法の詳細は、動的アクションのデバッグを参照してください。

動的アクションを実装するプロセスには、次の手順があります。

  1. ページ上で、対話グリッド列、アイテム、ボタン、リージョン、JavaScript式またはjQueryセレクタを編集または作成します。このコンポーネントは、起動される時期を定義する際、動的アクション内で参照されます。

  2. アクションを起動するアプリケーション・ページから動的アクションを作成します。

  3. 動的アクションをテストするためにアプリケーションを実行します。

13.4.2 動的アクションの例の表示

動的アクションの例を表示するには、サンプル・アプリケーションのサンプル動的アクションをインストールします。または、Oracle Learning Library (http://www.oracle.com/oll/apex)に移動します。表示されるフィールドに検索基準(dynamic actionsなど)を入力して「検索」をクリックします。

13.4.3 動的アクション・イベントについて

ページで発生するイベントに基づいて起動する動的アクションを定義できます。Oracle Application Expressには、ブラウザ・イベント、フレームワーク・イベント、コンポーネント・イベントおよびカスタム・イベントの4種類のカテゴリが含まれています。この項では、サポートされるすべてのイベントについて説明します(JavaScriptの内部イベント名をカッコで示します)。

ブラウザ・イベント

注意:

ページの現在のユーザー・インタフェース・タイプに応じて、表示されるイベントは異なります。別のタイプに対応するイベントを選択する場合、現在のタイプに対応しないものも含むすべてのイベントを表示する「非サポートの表示」を選択できます。

  • 変更(change): コントロールが入力フォーカスを失い、フォーカスの取得後に値が変更された場合に起動します。サポートされているユーザー・インタフェース・タイプ: デスクトップおよびjQuery Mobileスマートフォン。

  • クリック(click): ポインティング・デバイスのボタンがトリガー要素上でクリックされたときに起動します。サポートされているユーザー・インタフェース・タイプ: デスクトップおよびjQuery Mobileスマートフォン。

  • ダブルクリック(dblclick): ポインティング・デバイスのボタンがトリガー要素上でダブルクリックされたときに起動します。サポートされているユーザー・インタフェース・タイプ: デスクトップ。

  • フォーカスを取得(focusing): ポインティング・デバイスまたは要素へのタブによる移動によってトリガー要素がフォーカスを受け取ったときに起動します。サポートされているユーザー・インタフェース・タイプ: デスクトップおよびjQuery Mobileスマートフォン。

  • キー・ダウン(keydown): キーボード上のキーが押されたときに起動します。矢印キーなどの特殊なキーストロークを(キーが押された後に)取得するときにこのイベントを使用します。サポートされているユーザー・インタフェース・タイプ: デスクトップおよびjQuery Mobileスマートフォン。

  • キー・プレス(keypress): キーボード上のキーが押され、結果としてテキストが入力されたときに起動します。実際のテキスト入力を取得するときにこのイベントを使用します。サポートされているユーザー・インタフェース・タイプ: デスクトップおよびjQuery Mobileスマートフォン。

  • キー・リリース(keyup): キーボード上のキーが解放されたときに起動します。矢印キーなどの特殊なキーストロークを(キーが解放された後に)取得するときにこのイベントを使用します。サポートされているユーザー・インタフェース・タイプ: デスクトップおよびjQuery Mobileスマートフォン。

  • フォーカスを失う(focusout): ポインティング・デバイスまたは要素からのタブによる移動によってトリガー要素がフォーカスを失ったときに起動します。サポートされているユーザー・インタフェース・タイプ: デスクトップおよびjQuery Mobileスマートフォン。

  • マウス・ボタン・プレス(mousedown): ポインティング・デバイスのボタンがトリガー要素上で押されたときに起動します。サポートされているユーザー・インタフェース・タイプ: デスクトップ。

  • マウス・ボタン・リリース(mouseup): ポインティング・デバイスのボタンがトリガー要素上で解放されたときに起動します。サポートされているユーザー・インタフェース・タイプ: デスクトップ。

  • マウス・エンター(mouseenter): ポインティング・デバイスがトリガー要素内に移動すると起動します。サポートされているユーザー・インタフェース・タイプ: デスクトップ。

  • マウス・リーブ(mouseleave): ポインティング・デバイスがトリガー要素外に移動すると起動します。サポートされているユーザー・インタフェース・タイプ: デスクトップ。

  • マウス・ムーブ(mousemove): ポインティング・デバイスがトリガー要素上にあるとき、移動すると起動します。サポートされているユーザー・インタフェース・タイプ: デスクトップ。

  • 方向の変更(orientationchange): デバイスの方向を(水平方向または垂直方向に)変更する際に起動します。'this.browserEvent' JavaScriptオブジェクトには、'portrait'または'landscape'のいずれかと同等な'orientation'プロパティが含まれています。サポートされるユーザー・インタフェース・タイプ: jQuery Mobileスマートフォン。

  • ページのロード(「デスクトップ」ユーザー・インタフェースではreadyを使用し、「jQuery Mobileスマートフォン」ユーザー・インタフェースではpageintを使用): ページのロード時に起動します。サポートされているユーザー・インタフェース・タイプ: デスクトップおよびjQuery Mobileスマートフォン。

  • ページのアンロード(unload): ページがアンロードされるときに起動します。サポートされているユーザー・インタフェース・タイプ: デスクトップおよびjQuery Mobileスマートフォン。

  • サイズ変更(resize): ブラウザ・ウィンドウがサイズ変更されるときに起動します。サポートされているユーザー・インタフェース・タイプ: デスクトップ。

  • リソースのロード(load): トリガー要素がウィンドウ要素の場合(「時期」属性の「JavaScript式」値にwindowを使用)、ブラウザでドキュメント内のすべてのコンテンツ(ウィンドウ、フレーム、オブジェクトおよびイメージを含む)のロードが完了したときにイベントが起動します。その他の要素では、このイベントはURLに関連付けられた要素(イメージ、スクリプト、フレーム、iframe)にのみ使用できます。サポートされているユーザー・インタフェース・タイプ: デスクトップおよびjQuery Mobileスマートフォン。

  • スクロール(scroll): スクロール可能なトリガー要素がスクロールされるときに起動します。これは、ブラウザ・ウィンドウ(「時期」属性の「JavaScript式」値にwindowを使用)、スクロール可能なフレーム、またはCSSプロパティのoverflowscroll (要素の明示的な高さがコンテンツの高さよりも低いときはauto)に設定されている要素が考えられます。サポートされているユーザー・インタフェース・タイプ: デスクトップおよびjQuery Mobileスマートフォン。

  • スクロール・スタート(scrollstart): スクロールの開始時に起動します。サポートされるユーザー・インタフェース・タイプ: jQuery Mobileスマートフォン。

  • スクロール・ストップ(scrollstop): スクロールの終了時に起動します。サポートされるユーザー・インタフェース・タイプ: jQuery Mobileスマートフォン。

  • 選択(select): ユーザーがテキスト・フィールドの一部のテキストを選択するときに起動します。サポートされているユーザー・インタフェース・タイプ: デスクトップおよびjQuery Mobileスマートフォン。

  • スワイプ(swipe): 1秒以内に水平方向に30px以上(および垂直方向に75px未満)ドラッグされた場合に起動します。サポートされるユーザー・インタフェース・タイプ: jQuery Mobileスマートフォン。

  • 左スワイプ(swipeleft): 左方向へ移動するスワイプ・イベントが発生した場合に起動します。サポートされるユーザー・インタフェース・タイプ: jQuery Mobileスマートフォン。

  • 右スワイプ(swiperight): 右方向へ移動するスワイプ・イベントが発生した場合に起動します。サポートされるユーザー・インタフェース・タイプ: jQuery Mobileスマートフォン。

  • タップ(tap): クイック・タッチ・イベント後に起動します。サポートされるユーザー・インタフェース・タイプ: jQuery Mobileスマートフォン。

  • タップ・アンド・ホールド(taphold): ホールド・タッチ・イベント(1秒近くのホールド)後に起動します。サポートされるユーザー・インタフェース・タイプ: jQuery Mobileスマートフォン。

  • タッチ・キャンセル(vmousecancel): タッチまたはマウスキャンセル・イベントを処理する正規化されたイベント。サポートされるユーザー・インタフェース・タイプ: jQuery Mobileスマートフォン。

  • タッチ・エンド(vmouseup): タッチ・エンドまたはマウス・アップ・イベントを処理する正規化されたイベント。サポートされるユーザー・インタフェース・タイプ: jQuery Mobileスマートフォン。

  • タッチ・ムーブ(vmousemove): タッチ・ムーブまたはマウス・ムーブ・イベントを処理する正規化されたイベント。サポートされるユーザー・インタフェース・タイプ: jQuery Mobileスマートフォン。

  • タッチ・スタート(vmousedown): タッチ・スタートまたはマウス・ダウン・イベントを処理する正規化されたイベント。サポートされるユーザー・インタフェース・タイプ: jQuery Mobileスマートフォン。

  • 仮想クリック(vclick): タッチ・エンドまたはマウス・クリック・イベントを処理する正規化されたイベント。タッチ・デバイスでは、このイベントは「タッチ・エンド」後に送信されます。サポートされるユーザー・インタフェース・タイプ: jQuery Mobileスマートフォン。

フレームワーク・イベント

  • リフレッシュ後(apexafterrefresh): トリガー要素がリフレッシュされた後に起動します。このイベントは、部分ページ・リフレッシュを実行し、このイベントを起動するトリガー要素にのみ有効です。これをサポートするネイティブ・コンポーネントは、「対話モード・レポート」、「クラシック・レポート」、「チャート」、「リスト・ビュー」およびカスケードLOVサポートが存在するすべてのアイテム・タイプです。プラグインでもこのイベントがサポートされる場合があります。サポートされているユーザー・インタフェース・タイプ: デスクトップおよびjQuery Mobileスマートフォン。

  • ページの送信前(apexbeforepagesubmit): ページが送信される前に起動します。サポートされているユーザー・インタフェース・タイプ: デスクトップおよびjQuery Mobileスマートフォン。

  • リフレッシュ前(apexbeforerefresh): トリガー要素がリフレッシュされる前に起動します。このイベントは、部分ページ・リフレッシュを実行し、このイベントを起動するトリガー要素にのみ有効です。これをサポートするネイティブ・コンポーネントは、「対話モード・レポート」、「クラシック・レポート」、「チャート」、「リスト・ビュー」およびカスケードLOVサポートが存在するすべてのアイテム・タイプです。プラグインでもこのイベントがサポートされる場合があります。サポートされているユーザー・インタフェース・タイプ: デスクトップおよびjQuery Mobileスマートフォン。

  • ダイアログのクローズ(apexafterclosedialog): Application Expressのダイアログを閉じたときに起動します。このイベントは、「ダイアログを閉じる」ページ・プロセスまたは「ダイアログを閉じる」動的アクションを使用してダイアログを閉じたときにのみ起動します。サポートされているユーザー・インタフェース・タイプ: デスクトップおよびjQuery Mobileスマートフォン。

コンポーネント・イベント

これらのイベントは、カスタム・イベントをトリガーする、アプリケーションで使用可能なコンポーネント(アイテム、リージョンまたは動的アクションのいずれか)が存在する場合にのみ使用できます。これらのイベントは、イベント名[コンポーネント名]の書式で表示され、たとえばShuttleネイティブ・アイテム・タイプによってトリガーされるChange Orderイベントは、Change Order [Shuttle]と表示されます。コンポーネントのイベントは、Oracle Application Expressに付属のネイティブ・コンポーネントまたはアプリケーションにインストールしたプラグイン・コンポーネントのいずれかからトリガーされます。

  • ネイティブ・コンポーネントによってトリガーされるイベント

    順序の変更[シャトル](shuttlechangeorder): 右側の選択リストの値の順序が変更された(Move Top、Move Up、Move DownまたはMove Bottomを使用)ときに起動します。Oracle Application Expressでは現在、ネイティブ・コンポーネントによってトリガーされるイベントは他にありません。サポートされているユーザー・インタフェース・タイプ: デスクトップおよびjQuery Mobileスマートフォン。

  • プラグイン・コンポーネントによってトリガーされるイベント

    これらは現在のアプリケーションに追加されると使用可能になり、イベント名[コンポーネント名]の書式になります。プラグインが発生させるイベントに関連したヘルプについては、「共有コンポーネント」、「プラグイン」、「プラグイン名」、「ヘルプ・テキスト」にナビゲートして、プラグイン構成ページのヘルプ・テキストを参照してください(プラグイン作成者がここにドキュメントを格納している場合があります)。サポートされるユーザー・インタフェース・タイプ: プラグインの「ユーザー・インタフェース」→「サポート対象」設定によって決まります。

  • カスタム・イベント:

    「カスタム」を選択すると、カスタム・イベントを定義できる追加のフィールドが表示されます。これは、ネイティブまたはプラグインによって提供されるイベントが十分でない場合に役立ちます。

13.4.4 ページ・デザイナでの動的アクションの管理

この項では、ページ・デザイナで動的アクションを管理する方法について説明します。

トピック:

13.4.4.1 ページ・デザイナでの動的アクションの作成

動的アクションの作成には、アクションが発生する時期(オプション条件を指定する)、実行されるアクションおよびアクションの影響を受ける要素を指定する手順が含まれます。プロパティ・エディタ属性の詳細は、属性を選択し、中央ペインで「ヘルプ」タブをクリックして、参照してください。

ページ・デザイナで動的アクションを作成するには:

  1. ページ・デザイナでページを表示します。
    1. ワークスペースのホームページで、「アプリケーション・ビルダー」アイコンをクリックします。
    2. アプリケーションを選択します。
    3. ページを選択します。
    ページ・デザイナが表示されます。
  2. 左ペインで「動的アクション」タブをクリックします。
  3. 「動的アクション」で、「イベント」を右クリックし、「動的アクションの作成」を選択します。

    ヒント:

    イベント・タイプを選択してから右クリックして、「動的アクションの作成」を選択することもできます。

    プロパティ・エディタに動的アクション属性が表示されます。

    「メッセージ」タブに、対処が必要なメッセージを示す赤または黄色の印が表示されます。メッセージを選択すると、プロパティ・エディタに関連する属性が表示されます。赤いエラー・メッセージは、保存する前に対処する必要があります。

  4. プロパティ・エディタで、次の動的アクション属性を編集します。

    ヒント:

    属性の詳細は、プロパティ・エディタで属性を選択し、中央ペインで「ヘルプ」タブをクリックして、参照してください。

    1. 指定名前 - 動的アクションの名前を入力します。

    2. 実行オプション順序 - この計算の順序を入力します。これによって実行の順序が決まります。

    3. 時期イベント - 動的アクションを起動するイベントを指定します。

    4. 時期選択タイプ - イベントのトリガーに使用するページ要素または構成体のタイプを選択します。

      注意:

      選択されたイベントでページ要素の定義がサポートされている場合にのみ、使用できます。「ページのロード」、「ページのアンロード」、「サイズ変更」、「ページの送信前」、「方向の変更」のイベントを選択すると、この属性は非表示になります。他のすべてのイベント・タイプでは、このフィールドが表示されます。

    5. クライアント側の条件タイプ - オプションで、動的アクションのtrueおよびfalseアクション処理を制御する条件のタイプを選択します。クライアント側の条件が定義されていない場合、trueアクションのみが起動します。クライアント側の条件が定義されている場合、条件を満たすと、trueアクションが起動され、条件を満たさない場合は、falseアクションが起動されます。

      注意:

      宣言的に条件を定義できるように、他のプロパティはタイプに基づいて条件付きで表示されます。条件タイプItem = Valueの例では、ItemおよびValueプロパティが表示され、条件の評価でチェックされます。

    次に、イベントがTrueまたはFalseに評価された場合に実行するアクションを定義します。
  5. 既存のアクションを編集するには、次のステップを実行します。
    1. 動的アクション・ツリーを展開し、既存のアクションを選択します(TrueまたはFalseを選択します)。

    2. プロパティ・エディタで、次のアクション属性を編集します。

      • アクション - 実行するアクションを指定します。

      • 影響を受ける要素 - このアクションが実行されると影響を受けるページ・コンポーネントの定義方法を選択します。選択した要素のタイプに応じて、追加のオプションが表示されます。

      • 実行オプションイベント結果時に実行 - トリガー要素条件が満たされたときにアクションを起動する(Trueアクション)か、満たされないときに起動する(Falseアクション)かをTrueまたはFalseを選択して指定します。条件が指定されていない場合、Trueアクションのみが起動されます。

      • 選択タイプ - このアクションが実行されると影響を受けるページ・コンポーネントの定義方法を選択します。

      • 初期化時に実行 - 初期化時にアクションを起動するかどうかを指定します。

        初期化の意味は、動的アクションがどのように定義されているかによって多少異なります。動的アクションが対話グリッド列で起動するように定義されている場合、これは、対話グリッド行が編集のためにアクティブ化されたときにアクションを起動するかどうかを指定します。他のすべての動的アクションでは、これは、ページがロードされたときにアクションを起動するかどうかを指定します。

  6. 新規アクションを追加するには、次のようにします。
    1. 「動的アクション」ツリーを展開します。

    2. 動的アクションを右クリックし、「TRUEアクションの作成」または「FALSEアクションの作成」を選択します。

    3. 前の手順で説明したように、プロパティ・エディタでアクションを編集します。

  7. 「保存」をクリックします。

13.4.4.2 ページ・デザイナでの動的アクションの編集

動的アクションを作成した後、作成プロセス中に定義した属性を変更したり、プロセス中に指定できなかった属性を指定したり(「認可スキーム」の指定など)、追加のtrueアクションを追加できます。

動的アクションを編集するには、次のステップを実行します。

  1. ページ・デザイナでページを表示します。
    1. ワークスペースのホームページで、「アプリケーション・ビルダー」アイコンをクリックします。
    2. アプリケーションを選択します。
    3. ページを選択します。
    ページ・デザイナが表示されます。
  2. 左ペインで「動的アクション」タブをクリックします。動的アクションがイベント別に編成されます。
  3. 該当するイベントを展開し、動的アクションを選択します。
    動的アクションの属性がプロパティ・エディタに表示されます。
  4. プロパティ・エディタで、該当する動的アクション属性を編集します。

    ヒント:

    属性の詳細は、プロパティ・エディタで属性を選択し、中央ペインで「ヘルプ」タブをクリックして、参照してください。

  5. 既存のアクションを編集するには、次のステップを実行します。
    1. 「動的アクション」ツリーを展開し、「True」または「False」ノードを表示します。
    2. 「True」または「False」で、アクションを選択します。
    3. プロパティ・エディタでアクションを編集します。
  6. 新規アクションを追加するには、次のようにします。
    1. 「動的アクション」ツリーを展開します。
    2. 動的アクションを右クリックし、「TRUEアクションの作成」または「FALSEアクションの作成」を選択します。
    3. プロパティ・エディタでアクションを編集します。
  7. 「保存」をクリックします。

13.4.4.3 動的アクションのイベント有効範囲の定義

動的アクションを作成した後、アクションの有効範囲を1回のみのトリガーとするか、現在のページの存続期間中とするか、トリガー要素が部分ページ・リフレッシュ(PPR)によって更新されるまでとするかを変更できます。

有効範囲を指定するには、次のステップを実行します。

  1. ページ・デザイナでページを表示します。
    1. ワークスペースのホームページで、「アプリケーション・ビルダー」アイコンをクリックします。
    2. アプリケーションを選択します。
    3. ページを選択します。
    ページ・デザイナが表示されます。
  2. 左ペインで「動的アクション」タブをクリックします。
  3. 「動的アクション」で、動的アクションを選択します。

    プロパティ・エディタに、動的アクションの属性が表示されます。

    属性は、機能グループに編成されます。これらのグループを展開または縮小するには、「共通の表示」「すべて表示」「すべて閉じる」および「すべて開く」アイコンをクリックします。

    グループまたは属性を検索するには、「フィルタ・プロパティ」フィールドにキーワードを入力します。

  4. プロパティ・エディタですべての属性を表示するには、「すべて表示」をクリックします。
  5. 「詳細」で、「イベント有効範囲」を選択します。イベントの有効範囲によって、イベントが2回目または連続して評価されるタイミングが決まります。オプションは次のとおりです。
    • 静的: カレント・ページの存続期間中、イベント・ハンドラをトリガー要素にバインドします。ただし、トリガー要素が部分ページ・リフレッシュ(PPR)で更新された場合はバインドされなくなります。

    • 動的: 部分ページ・リフレッシュ(PPR)で再作成されるトリガー要素に関係なく、カレント・ページの存続期間中、イベント・ハンドラをトリガー要素にバインドします。

    • 1回: イベント・ハンドラをトリガー要素に1回のみバインドします。ページが完全にリフレッシュされるまで、動的アクションが再度トリガーされることはありません。

  6. 「保存」をクリックします。

13.4.4.4 ページ・デザイナでの動的アクションの削除

動的アクションを削除するには、次のステップを実行します。

  1. ページ・デザイナでページを表示します。
    1. ワークスペースのホームページで、「アプリケーション・ビルダー」アイコンをクリックします。
    2. アプリケーションを選択します。
    3. ページを選択します。
    ページ・デザイナが表示されます。
  2. 左ペインで「動的アクション」タブをクリックします。
  3. 該当するイベントを展開し、削除する動的アクションを見つけます。
  4. 動的アクションを右クリックして、「削除」を選択します。
  5. 「保存」をクリックします。

13.4.5 レガシー・コンポーネント・ビューでの動的アクションの管理

開発者は、コンポーネント・ビューで動的アクションを作成および編集できます。

トピック:

13.4.5.1 コンポーネント・ビューでの動的アクションの作成

動的アクションの作成には、アクションが発生する時期(オプション条件を指定する)、実行されるアクションおよびアクションの影響を受ける要素を指定する手順が含まれます。

  1. 適切なページにナビゲートします。レガシー・コンポーネント・ビューでのページの表示を参照してください。

  2. 「ページ・レンダリング」で、「動的アクション」までスクロールして、「作成」アイコンをクリックします。

    「動的アクション」ウィザードが表示されます。

  3. 「指定」で、次の内容を入力し、「次へ」をクリックします。

    • 名前: 動的アクションの名前を入力します。

    • 順序: このコンポーネントの順序を入力します。これによって実行の順序が決まります。

  4. 「時期」で、次の内容を入力し、「次へ」をクリックします。

    1. イベント - 動的アクションを起動するイベントを指定します。動的アクション・イベントについてを参照してください。

    2. 選択タイプ: 動的アクションをトリガーするページ要素のタイプを選択します。ページ要素の名前を指定するための対応する名前フィールドが表示されます。

      注意:

      選択されたイベントでページ要素の定義がサポートされている場合にのみ、使用できます。「ページのロード」、「ページのアンロード」、「サイズ変更」、「ページの送信前」、「方向の変更」のイベントを選択すると、このフィールドは非表示になります。他のすべてのイベント・タイプでは、このフィールドが表示されます。

    3. 動的アクションをトリガーする1つ以上のページ要素の名前を指定します。複数ある場合は、ページ要素名をカンマで区切ります。

      • アイテム: 動的アクションをトリガーする1つ以上のページ・アイテム名を入力または選択します。複数のアイテムを指定する場合は、ページ・アイテムをカンマで区切ります。

      • ボタン: 動的アクションをトリガーするボタンを選択します。ボタンがテンプレート・ボタンの場合、選択されたボタンは、#BUTTON_ID#に設定されたID属性を含むボタン・テンプレートを使用する必要があります。動的アクション・フレームワークは、ボタンを参照するためにこのID値を使用します。

      • リージョン: 動的アクションをトリガーするリージョン名を選択します。選択されたリージョンは、ID属性を#REGION_STATIC_ID#に設定したコンテナ要素を含むリージョン・テンプレートを使用する必要があります。動的アクション・フレームワークは、リージョンを参照するためにこのID値を使用します。

        リージョンは、これ自体でイベントを発生させることも(「リフレッシュ前」や「リフレッシュ後」イベントなど)、リージョン内のアイテムまたは他の要素で発生するイベントを捕捉するコンテナになることもできます。このことがサポートされているイベントのサブセットは、変更(change)、クリック(click)、ダブルクリック(dblclick)、フォーカスの取得(focus)、キー・ダウン(keydown)、キー・プレス、キー・リリース(keyup)、フォーカスを失う(blur)、マウス・ボタン・プレス(mousedown)、マウス・ボタン・リリース(mouseup)、マウス・ムーブ(mousemove)のみです。

      • jQueryセレクタ: 動的アクションをトリガーする1つ以上のページ要素を戻すjQueryセレクタ構文を入力します。

      • JavaScript式: 動的アクションをトリガーするDOMまたはjQueryオブジェクトを返すための、JavaScript式を入力します。

    4. 条件: 条件を指定するには、「条件」リストから選択します。条件タイプによっては、条件をテストする値を入力する必要がある場合があります。条件が指定されない場合、Trueアクションのみが起動されます。条件を指定する場合、条件を満たすと、Trueアクションが起動され、条件を満たさない場合は、Falseアクションが起動されます。

  5. 「Trueアクション」で、以前指定されたイベントが発生して条件が満たされた場合に実行されるアクションを指定し、「次へ」をクリックします。

    • アクション - 条件が満たされた場合または「- 条件なし -」が指定されている場合に起動するTrueアクションを選択します。選択されたアクションによっては、追加のオプションが表示されます。

      ヒント:

      詳細は、フィールドレベル・ヘルプを参照してください。フィールドレベル・ヘルプの表示を参照してください。

    • ページのロード時に実行 - ページをロードするときにこのアクションをトリガーするには、このオプションを選択します。選択したアクションのタイプに応じて、このオプションを選択する場合もあれば、選択しない場合もあります。

    • 反対のFALSEアクションの生成: 反対のFALSEアクションも生成するには、このオプションを選択します。反対のアクションとして扱われるものには、「表示/非表示」、「有効/無効」および「クラスの追加/クラスの削除」があります。このオプションは、上述のアクションのいずれかが選択された場合および条件が指定された場合にのみ表示されます。

  6. 「影響を受ける要素」(影響を受ける要素がサポートされているアクションでのみ使用可能)で、この動的アクションによる影響を受ける要素と要素が受ける影響を指定し、「次へ」をクリックします。

    動的アクションを作成する最終ステップは、影響を受ける要素の選択が、選択したアクションによってサポートされているかどうかによって異なります。「ページの送信」のような一部のアクションでは、影響を受ける要素を選択する必要はありません。「表示」などの他のアクションでは、影響を受ける要素を選択する必要があります。影響を受ける要素の選択が、選択したアクションによってサポートされていない場合、最後のページは動的アクションの詳細を確認できる、確認ページとなります。影響を受ける要素の選択が、選択したアクションによってサポートされている場合、このページのオプションは次のとおりです。

    • 選択タイプ: 動的アクションによる影響を受けるページ要素のタイプを選択します。選択されたタイプによって、追加のオプションが表示されます。これらのオプションを使用して、要素が受ける影響を指定するために必要な追加の設定と値を指定します。

      ヒント:

      詳細は、選択を行ってからフィールドレベル・ヘルプを参照してください。フィールドレベル・ヘルプの表示を参照してください。

  7. 「動的アクションの作成」をクリックします。

13.4.5.2 コンポーネント・ビューでの動的アクションの編集

動的アクションを作成した後、作成プロセス中に定義した属性を変更したり、プロセス中に指定できなかった属性を指定したり(「認可スキーム」の指定など)、追加のtrueアクションを追加できます。

動的アクションを編集するには、次のステップを実行します。

  1. 適切なページにナビゲートします。レガシー・コンポーネント・ビューでのページの表示を参照してください。
  2. 「ページ・レンダリング」で、「動的アクション」までスクロールして、変更する動的アクションをクリックします。

    動的アクションの編集ページが表示されます。

  3. 対象となる属性を編集します。

    属性の詳細は、フィールドレベル・ヘルプを参照してください。フィールドレベル・ヘルプの表示を参照してください。

  4. 「変更の適用」をクリックします。

13.4.5.3 Trueアクションの追加

この項では、Trueアクションを追加する方法について説明します。

トピック:

13.4.5.3.1 Trueアクションの追加について

動的アクションには、Trueアクションが起動する時期を制御するために指定できる条件が含まれています。たとえば、従業員情報をマネージャに表示するアプリケーションについて考えます。従業員が上級一般職の場合は給与が表示され、それ以外の場合は時給が表示されます。

動的アクション作成ウィザードでは、1つのTrueアクションのみ指定できます。複数のアクションを追加するには、動的アクションを作成するための作成ウィザードを使用した後、Trueアクションを追加するようにアクションを編集する必要があります。

13.4.5.3.2 Trueアクションの追加

アクションを追加するには、次の手順を実行します。

  1. 適切なページにナビゲートします。レガシー・コンポーネント・ビューでのページの表示を参照してください。

  2. 「ページ・レンダリング」で、「動的アクション」までスクロールして、変更する動的アクションをクリックします。

    動的アクションの編集ページが表示されます。

  3. 条件が満たされたとき、または条件が指定されなかったときに実行されるアクションを追加するには、「Trueアクション」までスクロールして、「Trueアクションの追加」をクリックします。

    アクションの作成/編集ページが表示されます。

  4. 「指定」で、次の項目を指定します。

    1. 順序: このコンポーネントの順序を入力します。これは、実行順序を示します。

    2. アクション: 条件がtrueのときにトリガーされるアクションを選択します。

  5. 「実行オプション」で、次の項目を指定します。

    1. ページのロード時に実行: ページをロードするときにもアクションをトリガーする場合に選択します。

    2. 対象となる属性を編集します。

      属性の詳細は、フィールドレベル・ヘルプを参照してください。フィールドレベル・ヘルプの表示を参照してください。

  6. 「影響を受ける要素」で、次の項目を指定します(選択されたアクションで、影響を受ける要素の定義がサポートされる場合にのみ使用可能)。

    注意:

    選択されたアクションのタイプによって、次のフィールドの一部またはすべてを選択できないことがあります。たとえば、「無効化」アクションでは、影響を受ける要素として「リージョン」を選択することがサポートされていません。

    1. 選択タイプ: 動的アクションによる影響を受けるページ要素のタイプを選択します。ページ要素の名前を指定するための対応する名前フィールドが表示されます。

  7. 「コメント」に、開発者のコメントまたは注意を入力します。これらのコメントは、アプリケーションの実行中に表示されません。

  8. 「作成」をクリックします。

    動的アクションの編集ページが表示され、追加したアクションが「Trueアクション」の下に表示されます。

13.4.5.4 頻度と有効範囲の定義

動的アクションを作成した後、アクションの有効範囲を1回のみのトリガーとするか、現在のページの存続期間中とするか、トリガー要素が部分ページ・リフレッシュ(PPR)によって更新されるまでとするかを変更できます。

有効範囲を指定するには、次のステップを実行します。

  1. 適切なページにナビゲートします。レガシー・コンポーネント・ビューでのページの表示を参照してください。

  2. 「ページ・レンダリング」で、「動的アクション」までスクロールして、変更する動的アクションをクリックします。

    動的アクションの編集ページが表示されます。

  3. 「詳細」までスクロールします。「イベント有効範囲」で、次のいずれかを選択します。

    1. 静的(デフォルト): 現在のページの存続期間中、イベント・ハンドラをトリガー要素にバインドします。ただし、トリガー要素が部分ページ・リフレッシュ(PPR)を通じて更新された場合はバインドされなくなります。

    2. 動的: 現在のページの存続期間中、イベント・ハンドラをトリガー要素にバインドします(部分ページ・リフレッシュ(PPR)を通じて更新されたトリガー要素を含む)。「動的」を指定すると、追加のフィールド「静的コンテナ(jQueryセレクタ)」が表示されます。静的コンテナを指定すると、動的イベント有効範囲でのイベント処理のパフォーマンスの向上に役立ちます。これは、それ自体は再生成されないページの要素ですが、部分ページ・リフレッシュ(PPR)によって再生成されるトリガー要素を含みます。この要素参照は、jQueryセレクタとして定義する必要があります。たとえば、(PPRによって再作成される)対話モード・レポート・リージョンの行になんらかの処理を実行する動的アクションがある場合、レポートのリフレッシュ後も動的アクションが機能するようにするには、「イベント有効範囲」が「動的」である必要があります。また、静的コンテナの値を、リージョンの静的ID値を選択するjQueryセレクタに設定できます(例: '#my_region')。

    3. 1回: 1回のみのイベントについて、イベント・ハンドラをトリガー要素にバインドします。

  4. 「変更の適用」をクリックします。

13.4.6 動的アクションを使用したJavaScriptのコールについて

動的アクションを作成することによっても、JavaScriptコードを実行できます。JavaScriptコードは、「JavaScriptコードの実行」および「値の設定」タイプで実行できます。クライアント側の条件タイプを「JavaScript式」に設定することにより、動的アクションの条件に対してJavaScriptコードを使用することもできます。

13.4.7 動的アクションのデバッグ

この項では、Oracle Application Expressで動的アクションをデバッグする方法について説明します。

トピック:

13.4.7.1 動的アクションのデバッグについて

Oracle Application Express内での動的アクションのデバッグは、他のデバッグと少し異なります。これは、動的アクション・フレームワーク内で実行される処理の多くが、サーバー側でなくクライアント側で実行されるためです。動的アクションをデバッグするには、ブラウザでJavaScriptコンソールがサポートされている場合、Oracle Application Expressがデバッグ情報をブラウザのJavaScriptコンソールに出力します(たとえば、FirebugがインストールされたFirefoxは、デバッグ情報を「Console」ペインに表示します)。デバッグ情報により、動的アクションが起動した時期、および動的アクションについての追加情報が次の形式で表示されます。

Dynamic Action Fired: [Dynamic Action name] ([Action name]) {JavaScript object containing all Dynamic Action information}

この形式によって、動的アクション名、トリガーされたアクションを示すアクション名、動的アクションに関する多くの情報(WHEN要素、影響を受ける要素、イベント・オブジェクト、動的アクションに関連付けられているデータなど)を含むJavaScriptオブジェクトを識別できます。

13.4.7.2 動的アクションのデバッグ

動的アクションをデバッグするには、次のステップを実行します。

  1. 動的アクションが含まれているアプリケーションのデバッグが有効化されていることを確認します。デバッグ・モードの使用を参照してください。
  2. 動的アクションが含まれているページを実行します。
  3. ブラウザのJavaScriptコンソールを開きます。
  4. 開発者ツールバーで、「デバッグ」をクリックします。

    ページがリフレッシュされます。ページのロード時に起動するように設定されている動的アクションがある場合は、ブラウザ・コンソールにデバッグ出力が表示されます。

    デバッグ情報はデバッグ・モードで実行されている場合にのみ出力されるため、デバッグ・モードをオンのままにすることで、動的アクションが予期される時期に起動されるかどうかをさらにテストできます。たとえば、ある特定のアイテムの値が変更されるときに起動する動的アクションを定義した場合、そのアイテムの値を変更すると、動的アクションが起動したかどうかのデバッグ出力がコンソールに表示されます。