アクションセットを使用したイベント処理の設定
ユーザーインターフェイス(UI)は、よりインタラクティブなユーザー体験を提供するために、フォームを送信する前に、ユーザーがある特定のアクションを実行できるようにするコントロールを含められます。
イベントアクションモデル
行動につながるコントロールは、チェックボックスやボタンなどのコントロールのための原因と結果の関係を構築するイベントアクションモデルに基づいています。 イベントは、ボタンのクリックやフィールドの入力など、ユーザーのアクティビティによって引き起こされるトリガーです。 アクションは、ケースの作成、またはユーザーにインプットを促すためにフィールドに関する情報を表示するなどの、アプリケーションによる応答です。
たとえば、オンラインショップが、注文用の配送先住所を支払いのための請求先住所として顧客に使えるようにしたいとします。 請求先住所を入力するためのフォームは、ユーザーにチェックボックスを提供します。 ユーザーがチェックボックスを選択すると、アプリケーションは、配送先住所の情報を請求先住所フィールドにコピーし、請求先住所フィールドの修正を無効にします。 ユーザーがチェックボックスの選択を解除すると、アプリケーションは、請求先住所フィールドの入力を削除し、ユーザーが住所を入力できるようにします。
以下の画像の中央にある縦棒をスライドすると、ユーザーがチェックボックスをクリックまたはクリアにした時の、住所フォームの表示の変化が確認できます。
次の表は、イベントアクションペアの例を示しています。
イベント | アクション |
---|---|
ボタン、リンク、アイコンなどのコントロールをクリックする | 新しいウィンドウを開く |
グリッドの行をダブルクリックする | 列の内容の編集が可能になる |
キーボード上のEnterキーを押す | メニューを表示する |
都道府県のリストから値を選ぶ | オフィス所在地のリストを更新する |
Quantityフィールドに値を入力する | 注文を履行するために在庫が十分あることを確認する |
アクションセット
Pega Platform™アプリケーションでは、行動につながるコントロールを設定するためにアクションセットを使用します。 アクションセットは、1つ以上のイベントおよび1つ以上のアクションで構成されています。 オプションとして、条件が満たされた場合のみにアクションが発生するように、各アクションに条件を追加できます。
次の図の「+」アイコンをクリックすると、オンラインショップに注文が送信されると、アクションセットがフォームの請求先住所フィールドに入力する仕組みが表示されます。
以下のインタラクションで理解度をチェックしてください。
アクションセットの最適化
アクションセットを設定する場合、リフレッシュアクションとサーバーの呼び出しでユーザーエクスペリエンスとデータがどのように影響を受けるかを考慮します。 たとえば、ユーザーが画面の更新を待機するか、前の画面に手動で戻る必要がある場合、ユーザーフローが中断されることになります。
次の場合にセクションをリフレッシュします。
- プロパティ値はサーバー上で更新され、UIで新しい値を反映する必要がある場合。
- 行の削除など、クライアントのみで発生する複数のプロパティに変更を加えるアクションを送信する必要がある場合。
- 一部のUIでは、他の入力のためにDocument Object Model(DOM)からの削除が求められます。
以下の場合は、セクションを更新しないでください。
- ユーザー入力をサブミットする必要がある場合。 この場合、代わりに、ポスト値アクションを使用します。
- ユーザーアクションの後に、データトランスフォームまたはアクティビティを呼び出す必要がある場合。
- 可視性、有効/無効、または読み取り専用状態を再計算する必要がある場合。 式フィールドのとなりのEvaluate on client チェックボックスにチェックを入れます。
可能な限りRefresh Whenアクションを使用して従属を宣言します。 正確なデータを維持するには、サーバー上のデータとの同期を維持する必要がある読み取り専用の参照に対して、RefreshWhenアクションを使用します。 たとえば、ホテルの場所が変わったときだけ更新が必要なホテルの詳細情報をリフレッシュします。
Refresh Whenが不可能な場合は、ターゲットリフレッシュのRefresh Other Sectionアクションを使用します。 たとえば、他の入力またはボタンクリックなどの追跡不可能な入力に基づいて更新される編集可能な参照がある場合は、Refresh Other Sectionを使用します。
アクションセットのアクションを統合する
アクションセットの各アクションでは、サーバーに対して少なくとも1つのHTTPリクエストが生成され、設定された順序で実行されます。 アクションを最適化し、サーバーに対するHTTPリクエストの数を減らすには、次のベストプラクティスを使用します。
- プレアクティビティまたはプレデータトランスフォームがセクションの更新と同じコンテキストで実行される場合は、セクション更新アクションで設定します。
- 更新セクションのコンテキストで実行する場合に、必要に応じてプレアクティビティのコンテンツを変更します。
- ラッパーアクティビティまたはラッパーデータトランスフォームを使用して、すべてのアクションを統合します。
以下の画像の中央にある縦線をスライドすると、アクションセット内のアクションをラッパーアクティビティに統合する方法を確認できます。
投稿およびセクション更新のアクションを区別する
デフォルトでは、Refresh sectionアクションにより、フォームに適用された保留中のすべての変更がサーバーに返されます。 Refresh This Sectionアクションなど、セクション更新アクションの前にPost valueアクションを使用する必要はありません。
Post valueアクションはサーバーを更新し、すべてのRefresh When条件を強制的に再評価します。 1つのPost valueアクションは、when条件を使用して複数のセクションに影響を及ぼすことができます。 それぞれのセクションにRefresh sectionを使用するのではなく、1つのPost valueアクションを使用します。 Post valueアクションを使用してすべてのセクションを更新することで、Refresh Other sectionを使用するときにアクションセットのセクション名のハードコーディングを回避できます。
たとえば、車両購入アプリケーションでは、ユーザーはCustomer IDを入力して、追加のアクセサリーを表示します。 Customer IDの値が変更されると、2つのセクションの条件が、Eliteメンバーシップのステータス、アクティブなメンバーシップ期間、車両の合計購入額など、保管されている顧客データに対して評価されます。 Exclusive lifestyle accessoriesセクションは、有効なCustomer IDが3台以上の車両を購入したユーザーに関連付けられている場合にのみリフレッシュされます。 Elite car accessoriesセクションは、有効なCustomer IDが10年以上アクティブなEliteメンバーであるユーザーに属している場合にのみリフレッシュされます。
以下の画像の中央にある縦線をスライドすると、無効なユーザーに表示されるビューとEliteメンバーに表示されるビューを比較できます。
このトピックは、下記のモジュールにも含まれています。
- UI要素のカスタマイズ v3