コアコンポーネントに基づくアダプティブフォームでのアダプティブフォームフラグメントの作成と使用 adaptive-form-fragments

バージョン
記事リンク
AEM as a Cloud Service(コアコンポーネント)
この記事
AEM as a Cloud Service(基盤コンポーネント)
ここをクリックしてください
AEM 6.5
ここをクリックしてください

すべてのフォームは特定の目的のために設計されますが、ほとんどのフォームにはいくつかの共通するセグメントがあります(例:名前と住所、家族の詳細、収入の詳細などの個人情報を入力するためのセグメント)。フォーム開発者は、新しいフォームを作成するたびに、これらの共通セグメントを作成する必要があります。

アダプティブフォームには、パネルやフィールドグループなどのフォームセグメントを 1 回だけ作成するための便利な機能が用意されています。作成したフォームセグメントは、アダプティブフォームで再利用することができます。この再利用可能なスタンドアロンのセグメントは、アダプティブフォームフラグメントと呼ばれます。

フォームフラグメントは複数のフォームにシームレスに統合され、一貫性のあるプロフェッショナルな外観のフォームを効率的に作成できます。フォームフラグメントは、「一度変更すればすべてに反映」機能を通じて、再利用性、標準化、ブランドの一貫性を確保します。1 か所で行われた更新が、これらのフラグメントを利用するすべてのフォームに自動反映されるので、メンテナンス性と効率性が向上します。

フラグメントを 1 つのドキュメントに複数回追加し、そのコンポーネントのデータ連結プロパティを使用すると、フラグメントを別のデータソースやスキーマに結び付けることができます。例えば、同じアドレスフラグメントを永続アドレス、通信アドレス、請求先アドレスに使用し、それをデータソースやスキーマの様々なフィールドに接続することができます。

NOTE
フォームフラグメントコンポーネントの設定ダイアログとデザインダイアログを使用して、ユーザーのフラグメントエクスペリエンスを簡単にカスタマイズできます。

アダプティブフォームフラグメントの作成 create-a-fragment

アダプティブフォームフラグメントは、最初から作成することも、既存のアダプティブフォーム内にパネルをフラグメントとして保存することもできます。フォームフラグメントを作成するには、次の手順を行います。

  1. AEM Forms オーサーインスタンス(https://[hostname]:[port]/aem/forms.html)にログインします。

  2. 作成/アダプティブフォームセグメント ​をクリックします。

    アダプティブフォームフラグメントを作成

  3. フラグメントのタイトル、名前、説明、タグを指定します。フラグメントには一意の名前を指定してください。同じ名前を持つ別のフラグメントが存在する場合、フラグメントの作成は失敗します。

  4. フォームテンプレートを選択します。コアコンポーネントベースのアダプティブフォーム、または基盤コンポーネントベースのアダプティブフォーム用のフォームフラグメントを作成できます。コアコンポーネントベースのフォームフォームフラグメントを作成するには、コアコンポーネントベースのテンプレートを選択します。

    コアコンポーネントベースのフォーム用のフォームフラグメントを作成する場合は、「フォームテーマを選択」オプションを使用して、コアコンポーネントベースのテーマを選択します。

  5. フォームモデル」タブをクリックして開き、「次から選択」ドロップダウンメニューから、フラグメントに対して次のいずれかのモデルを選択します。

    「フォームモデル」タブにモデルタイプを表示

    • なし:フォームモデルを使用しないで最初からフラグメントを作成するときに指定します。

      note note
      NOTE
      アダプティブフォームでは、(コアコンポーネントに基づく)単一のフォームフラグメントを複数回使用できます。ベースがないのフォームフラグメントおよびスキーマベースのフォームフラグメントの両方をサポートします。
    • スキーマ:AEM フォームにアップロードされた XML または JSON スキーマを使用してフラグメントを作成する場合に指定します。アップロードするかまたはフラグメントのフォームモデルとして使用可能な XML または JSON スキーマから選択できます。XML スキーマを選択する場合、「XML スキーマの複合型」ドロップダウンボックスから選択したスキーマ内に存在する complexType を選択することにより、アダプティブフォームフラグメントを作成することもできます。JSON スキーマを選択する場合、「JSON スキーマの定義」ドロップダウンボックスから選択したスキーマ内に存在するスキーマを選択することにより、アダプティブフォームフラグメントを作成することもできます。

    • フォームデータモデル:フォームデータモデル(FDM)を使用してフラグメントを作成する場合に指定します。フォームデータモデル(FDM)内の 1 つのデータモデルオブジェクトのみに基づいて、アダプティブフォームフラグメントを作成できます。フォームデータモデル(FDM)定義ドロップダウンを展開します。指定したフォームデータモデル(FDM)内のすべてのデータモデルオブジェクトをリスト表示します。リストからデータモデルオブジェクトを選択します。

    フォームデータモデル(FDM)

  6. 作成」をクリックし、次に「開く」をクリックして、編集モードでデフォルトのテンプレートを使ってフラグメントを開きます。編集モードでは、任意のアダプティブフォームコンポーネントをフラグメントに追加できます。

スキーマまたはフォームデータモデル(FDM)に基づいてアダプティブフォームフラグメントを作成すると、アダプティブフォームエディターでコンテンツブラウザーの「データソース」タブに、フォームデータモデル(FDM)またはスキーマ要素が表示されます。フォームモデルの要素をフラグメントにドラッグ&ドロップできます。追加されたフォームモデルの要素はフォームコンポーネントに変換されますが、関連したスキーマからの元のプロパティは保持されます。

アダプティブフォームにフラグメントを追加 insert-a-fragment-in-an-adaptive-form

アダプティブフォームフラグメントをアダプティブフォームに追加するには、次の手順を実行します。

  1. アダプティブフォームを編集モードで開きます。

  2. アダプティブフォームフラグメント ​コンポーネントをフォームに追加します。

  3. アダプティブフォームフラグメント ​コンポーネントの設定ダイアログを開きます。

  4. 基本」タブで「フラグメント参照」を選択します。フォームのモデルに応じて、フォームで使用可能なすべてのアダプティブフォームフラグメントが表示されます。

  5. アダプティブフォームの​ アダプティブフォームフラグメント ​コンポーネントでアダプティブフォームフラグメントを選択します。

    「アダプティブフォームフラグメント」オプションを選択

アダプティブフォームフラグメントは、アダプティブフォーム内の参照により追加され、スタンドアロンのアダプティブフォームフラグメントと同期されたままとなります。つまり、アダプティブフォームフラグメントに加えた変更は、そのフラグメントがアダプティブフォームに組み込まれるすべてのインスタンスに反映されます。

フラグメント内でのフラグメントの使用 using-fragments-within-fragments

ネストされたアダプティブフォームフラグメントを作成できます。つまり、フラグメントを別のフラグメントに追加し、ネストされたフラグメント構造を持つことができます。

アダプティブフォーム内でのフォームフラグメントの複数回の使用 using-form-fragment-mutiple-times-in-af

ベースがないフォームフラグメントおよびスキーマベースのフォームフラグメントをアダプティブフォーム内で複数回使用して、各フォームフラグメントフィールドに対して一意にデータを保存できます。例えば、住所フォームフラグメントを使用して、ローン申し込みフォームの本住所、連絡先住所、および現居住住所に関する詳細な住所を収集できます。

アダプティブフォームでの複数のフラグメントの使用

フラグメントの管理 manage-fragments

AEM Forms UI を使用して、アダプティブフォームフラグメントに対して複数の操作を実行できます。

  1. https://[hostname]/aem/forms.html にアクセスします。

  2. AEM Forms UI ツールバーで「選択」をクリックし、アダプティブフォームフラグメントを選択します。ツールバーには、選択されているアダプティブフォームフラグメントに対して実行できる次の操作が表示されます。

操作
説明
編集
選択されているアダプティブフォームフラグメントを編集モードで開きます。
プレビュー
フラグメントを HTML でプレビューするか、あるいは XML ファイルからのデータをフラグメントとマージしてカスタムプレビューを生成するかのオプションが与えられます。詳しくは、フォームのプレビューを参照してください。
ダウンロード
選択されているフラグメントをダウンロードします。
レビューの開始/レビューの管理
選択されているフラグメントのレビューを開始したり管理したりできます。詳しくは、レビューの作成と管理を参照してください。
辞書を追加
選択されているフラグメントをローカライズするための辞書を生成します。詳しくは、アダプティブフォームのローカライズを参照してください。
公開/非公開
選択されているフラグメントを公開/非公開します。
削除
選択されているフラグメントを削除します。

フラグメントで作業するときの考慮事項 key-points-to-remember-when-working-with-fragments

  • フラグメント名が一意であることを確認します。同じ名前の既存のフラグメントが存在する場合、フラグメントは作成できません。
  • スタンドアロンのアダプティブフォームフラグメント内の式、スクリプト、またはスタイルは、アダプティブフォームの参照によって挿入された場合や埋め込まれた場合にも保持されます。
  • アダプティブフォームフラグメントを編集することはできません。これはアダプティブフォーム内から参照によって挿入されたものです。編集するには、スタンドアロンのアダプティブフォームフラグメントを変更します。
  • アダプティブフォームを公開する場合、参照によってアダプティブフォームに挿入されたスタンドアロンのアダプティブフォームフラグメントを公開する必要があります。
  • 更新されたアダプティブフォームフラグメントを再公開すると、フラグメントが使用されているアダプティブフォームの公開済みインスタンスに変更が反映されます。
  • 検証コンポーネントが含まれているアダプティブフォームの場合、匿名ユーザーはサポートされません。また、アダプティブフォームフラグメントで検証コンポーネントを使用することはお勧めしません。

リファレンスフラグメント reference-fragments

フォームを作成するために使用できる参照用のアダプティブフォームフラグメントが使用できます。

関連トピック see-also

recommendation-more-help
fbcff2a9-b6fe-4574-b04a-21e75df764ab