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

最終更新日: 2023-12-07
  • 作成対象:
  • User
バージョン 記事リンク
AEM as a Cloud Service ここをクリックしてください
AEM 6.5 この記事

Adobeでは、最新の拡張可能なデータキャプチャを使用することをお勧めします コアコンポーネント 対象: 新しいアダプティブFormsの作成 または AEM SitesページへのアダプティブFormsの追加. これらのコンポーネントは、アダプティブフォームの作成における大幅な進歩を示すものであり、優れたユーザーエクスペリエンスを実現します。この記事では、基盤コンポーネントを使用してアダプティブフォームを作成するより従来的な方法について説明します。

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

アダプティブフォームは、パネルやフィールドのグループのようなフォームセグメントを 1 回だけ作成し、アダプティブフォーム間で再利用する便利なメカニズムです。 これらの再利用可能でスタンドアロンのセグメントは、アダプティブフォームフラグメントと呼ばれます。

フラグメントの作成

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

フラグメントを最初から作成

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

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

  3. フラグメントのタイトル、名前、説明、タグを指定します。

    メモ

    フラグメントには一意の名前を指定します。同じ名前を持つ別のフラグメントが既に存在する場合、フラグメントの作成は失敗します。

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

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

      メモ

      コアコンポーネントに基づくアダプティブFormsでは、1 つのフォームフラグメントを 1 つのフォーム内で複数回使用できます。 なしベースのフォームフラグメントとスキーマベースのフォームフラグメントの両方をサポートします。

    • フォームテンプレート:AEM Formsにアップロードされた XDP テンプレートを使用してフラグメントを作成する場合に指定します。 フラグメントのフォームモデルとして適当な XDP テンプレートを選択してください。

    フォームテンプレートをモデルとして使用したアダプティブフォームの作成

    選択したフォームテンプレート内でフラグメントとしてマークされたサブフォームも表示されます。ドロップダウンリストから、アダプティブフォームフラグメントのサブフォームを選択できます。

    指定したフォームテンプレートからサブフォームを選択する

    さらに、ドロップダウンボックスでサブフォームの SOM 式を指定することで、フォームテンプレートでフラグメントとしてマークされていないサブフォームを使用して、アダプティブフォームフラグメントを作成できます。

    • XML スキーマ:AEM Formsにアップロードされた XML スキーマを使用してフラグメントを作成する場合に指定します。 フラグメントのフォームモデルとして使用可能な XML スキーマからアップロードまたは選択できます。

    モデルとして XML スキーマに基づいてアダプティブフォームフラグメントを作成

    ドロップダウンボックスから選択されたスキーマにある complexType を選択することで、アダプティブフォームフラグメントを作成することもできます。

    指定した XML スキーマモデルから複合タイプを選択する

  5. 作成」をクリックし、次に「開く」をクリックして、編集モードでデフォルトテンプレートを使ってフラグメントを開きます。

編集モードでは、アダプティブフォームコンポーネントをAEMサイドキックからフラグメントにドラッグ&ドロップできます。 アダプティブフォームのコンポーネントについて詳しくは、 アダプティブフォームのオーサリングの概要.

さらに、フラグメントのフォームモデルとして、XML スキーマまたは XDP フォームテンプレートを選択していた場合は、フォームモデル階層を示す新しいタブがコンテンツファインダーに表示されます。これにより、フォームモデルの要素をフラグメントにドラッグ&ドロップできます。追加されたフォームモデルの要素はフォームコンポーネントに変換されますが、関連の XDP または XSD からの元のプロパティは保持されます。

パネルをフラグメントとして保存

  1. アダプティブフォームフラグメントとして保存するパネルが含まれているアダプティブフォームを開きます。

  2. パネルツールバーで、「フラグメントとして保存」をクリックします。フラグメントとして保存ダイアログが開きます。

    メモ

    フラグメントとして保存しようとしているパネルに子パネルが含まれている場合、生成されるフラグメントにはこれらの子パネルが含まれます。

  3. フラグメント作成ダイアログで、次の情報を指定します。

    • 名前:フラグメントの名前。デフォルト値はパネルのエレメント名です。このフィールドは必須です。

      メモ

      フラグメントには一意の名前を指定します。同じ名前を持つ別のフラグメントが既に存在する場合、フラグメントの作成は失敗します。

    • タイトル:フラグメントのタイトル。デフォルト値はパネルのタイトルです。

    • 説明:フラグメントの説明。

    • タグ:フラグメントのタグメタデータ。

    • ターゲットパス:フラグメントが保存されるリポジトリーパス。パスを指定しない場合、フラグメントと同じ名前のノードが、アダプティブフォームを含むノードの横に作成されます。 フラグメントはこのノードに保存されます。

    • フォームモデル:アダプティブフォームのフォームモデルに応じて、このフィールドには XML スキーマ, フォームテンプレート​または なし. このフィールドは編集できません。

    • フラグメントモデルのルート:XSD ベースのアダプティブフォームにのみ表示されます。 フラグメントモデルのルートを指定します。ドロップダウンリストから / または XSD 複合タイプを選択できます。フラグメントを別のアダプティブフォームで再利用できるのは、複合タイプをフラグメントモデルルートとして選択した場合のみです。/ をフラグメントモデルルートとして選択した場合、ルートからの完全な XSD ツリーは、「アダプティブフォームデータモデル」タブに表示されます。複合型フラグメントモデルルートの場合、選択した複合型の子孫のみが「アダプティブフォームデータモデル」タブに表示されます。 フラグメントを作成し、に複合型を選択した場合、 フラグメントモデルのルート​を使用すると、同じフォーム内または複数のフォーム間で、その複合型が使用されている場所で任意のタイプを使用できます。

    • XSD 参照:XSD ベースのアダプティブフォームにのみ表示されます。XML スキーマの場所を表示します。

    • XDP 参照:XDP ベースのアダプティブフォームにのみ表示されます。 XDP フォームテンプレートの場所を表示します。

    save-fragment

    フラグメントとして保存ダイアログ

  4. OK」をクリックします。

    パネルがリポジトリー内の指定した場所またはデフォルトの場所に保存されます。アダプティブフォームでは、パネルがフラグメントのスナップショットに置き換えられます。 以下に示すように、「一般情報」パネルとその子パネル、個人情報、アドレスは、フラグメントとして保存されます。

    フラグメントを編集するには、パネルツールバーで「アセットを編集」をクリックします。フラグメントが新しいタブまたはウィンドウ上に編集モードで開きます。

    フラグメントの編集

フラグメントの操作

フラグメントの外観の設定

アダプティブフォーム内に挿入したフラグメントは、プレースホルダー画像として表示されます。 プレースホルダーには、フラグメント内の子パネルのタイトルが最大 10 個まで表示されます。プレースホルダーの画像の代わりに完全なフラグメントを表示するようにAEM Formsを設定できます。

次の手順を実行して、フォームのフラグメントをすべて表示します。

  1. AEM Web コンソールの設定ページ(https:[host]:[port]/system/console/configMgr)に移動します。

  2. アダプティブフォームとインタラクティブ通信の web チャネル設定​を検索およびクリックして、編集モードで開きます。

  3. フラグメントの代わりにプレースホルダーを有効にする」チェックボックスを無効にして、プレースホルダーの画像の代わりにすべてのフラグメントを表示します。

アダプティブフォームにフラグメントを挿入する

作成したアダプティブフォームフラグメントは、AEMコンテンツファインダーの「アダプティブフォームフラグメント」タブに表示されます。 アダプティブフォームフラグメントをアダプティブフォームに挿入するには、次の手順を実行します。

  1. アダプティブフォームフラグメントを挿入するアダプティブフォームを編集モードで開きます。

  2. サイドバーの「Assets assets-browser」をクリックします。アセットブラウザーで、ドロップダウンリストから「アダプティブフォームフラグメント」を選択します。

    すべてのアダプティブフォームフラグメントを表示するか、フォームモデル(フォームテンプレート、XML スキーマ、基本)に基づいてフィルターするかを選択することもできます。

  3. アダプティブフォームフラグメントをアダプティブフォームにドラッグ&ドロップします。

    メモ

    アダプティブフォームフラグメントは、アダプティブフォーム内からのオーサリングでは有効になっていません。 また、JSON ベースのアダプティブフォームでは、XSD ベースのフラグメントを使用することも、その逆の方法で使用することもできません。

アダプティブフォームフラグメントは、アダプティブフォーム内の参照によって挿入され、スタンドアロンのアダプティブフォームフラグメントと同期されます。 つまり、アダプティブフォームフラグメントを更新すると、その変更が、フラグメントが使用されているすべてのアダプティブフォームに反映されます。

フラグメントをアダプティブフォームに埋め込む

アダプティブフォーム内にアダプティブフォームフラグメントを埋め込むには、 埋め込みアセット: <fragmentName> ボタンを使用して、追加されたフラグメントのパネルツールバーを表示できます(次の例を参照)。

フォームフラグメントのアダプティブフォーム内への埋め込み

メモ

埋め込まれたフラグメントは、スタンドアロンのフラグメントとリンクされなくなりました。埋め込まれたフラグメント内のコンポーネントは、アダプティブフォーム内から編集できます。

フラグメント内でのフラグメントの使用

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

フラグメントの変更

アダプティブフォームフラグメントを別のフラグメントで置き換えたり変更したりするには、 フラグメントアセットを選択 プロパティを編集して、アダプティブフォームフラグメントパネル用のコンポーネントを編集ダイアログに表示します。

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

スキーマベースのフォームフラグメントをアダプティブフォーム内で複数回使用して、各フォームフラグメントフィールドのデータを一意に保存することができます。 例えば、住所フォームフラグメントを使用して、住所の詳細を、ローン申し込みフォームで永続的な住所、コミュニケーション、および提示する住所に関する情報を収集できます。

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

メモ
  • アダプティブフォーム内で何度もベースでないフォームフラグメントを使用している場合、フラグメントのフィールド間でデータ同期がおこなわれます。 データ同期の問題は、コアコンポーネントベースのフォームフラグメントでは発生しません。1 つのフォームで、スキーマベースとなしベースのどちらでも複数回フラグメントを使用できます。

データ連結のためのフラグメントの自動マッピング

XFA フォームテンプレートまたは XSD 複合タイプを使用してアダプティブフォームフラグメントを作成し、フラグメントをアダプティブフォームにドラッグ&ドロップすると、XFA フラグメントまたは XSD 複合タイプは、フラグメントモデルルートが XFA フラグメントまたは XSD 複合タイプにマッピングされる対応するアダプティブフォームフラグメントに自動的に置き換えます。

コンポーネントの編集ダイアログから、フラグメントアセットとその連結を変更できます。

メモ

AEMコンテンツファインダーのアダプティブフォームフラグメントライブラリから連結されたアダプティブフォームフラグメントをドラッグ&ドロップし、アダプティブフォームフラグメントパネルの編集コンポーネントダイアログから正しい連結参照を提供することもできます。

フラグメントの管理

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

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

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

操作

説明

次を開きます:

選択したアダプティブフォームフラグメントを編集モードで開きます。

プロパティを表示

プロパティパネルを開きます。プロパティパネルから、プロパティの表示や編集、プレビューの生成、選択したフラグメントのサムネール画像のアップロードができます。詳しくは、「メタデータの管理」を参照してください。

コピー

選択されているフラグメントをコピーします。貼り付けボタンがツールバーに表示されます。

ダウンロード

選択されているフラグメントをダウンロードします。

プレビュー

フラグメントを HTML でプレビューするか、あるいは XML ファイルからのデータをフラグメントとマージしてカスタムプレビューを生成するかのオプションが与えられます。詳しくは、フォームのプレビューを参照してください。

レビューの開始/レビューの管理

選択されているフラグメントのレビューを開始したり管理したりできます。詳しくは、レビューの作成と管理を参照してください。

辞書の作成

選択されているフラグメントをローカライズするための辞書を生成します。詳しくは、 アダプティブフォームのローカライズ.

公開/非公開

選択されているフラグメントを公開/非公開します。

削除

選択されているフラグメントを削除します。

フラグメントを含むアダプティブフォームのローカライズ

アダプティブフォームフラグメントを含むアダプティブフォームをローカライズするには、フラグメントとフォームを別々にローカライズする必要があります。 考え方としては、フラグメントを 1 回ローカライズし、複数のアダプティブフォームで再利用することです。

メモ

フラグメント内のローカライゼーションキーは、アダプティブフォームの XLIFF ファイル内には表示されません。

フラグメントで作業するときの考慮事項

  • フラグメント名が一意であることを確認します。同じ名前の既存のフラグメントが存在する場合、フラグメントの作成は失敗します。
  • XDP ベースのアダプティブフォームで、別の XDP フラグメントを含むフラグメントとしてパネルを保存すると、結果のフラグメントは自動的に子 XDP フラグメントにバインドされます。 XSD ベースのアダプティブフォームがある場合、結果のフラグメントはスキーマのルートにバインドされます。
  • アダプティブフォームフラグメントを作成すると、フラグメントノードが作成されます。これは CRXDE Lite における、アダプティブフォームの guideContainer ノードに類似したものです。
  • 異なるフォームデータモデルを使用するアダプティブフォーム内のフラグメントはサポートされていません。 例えば、XDP ベースのフラグメントは XSD ベースのアダプティブフォームではサポートされませんが、その逆も同様です。
  • アダプティブフォームフラグメントは、AEMコンテンツファインダーの「アダプティブフォームフラグメント」タブを通じて使用できます。
  • スタンドアロンのアダプティブフォームフラグメント内の式、スクリプト、スタイルは、アダプティブフォームに参照によって挿入されたとき、または埋め込まれたときに保持されます。
  • アダプティブフォーム内からは、参照によって挿入されたアダプティブフォームフラグメントを編集することはできません。 編集するには、スタンドアロンのアダプティブフォームフラグメントを編集するか、アダプティブフォーム内にフラグメントを埋め込みます。
  • アダプティブフォームを発行する場合は、アダプティブフォーム内で参照によって挿入されたスタンドアロンのアダプティブフォームフラグメントを発行する必要があります。
  • 更新されたアダプティブフォームフラグメントを再発行すると、その変更は、フラグメントが使用されているアダプティブフォームの発行済みインスタンスに反映されます。
  • 検証コンポーネントを含むアダプティブフォームは、匿名ユーザーをサポートしません。 また、アダプティブフォームフラグメントで検証コンポーネントを使用することはお勧めしません。
  • Mac のみ)フォームフラグメント機能がすべてのシナリオで正しく動作するようにするには、/private/etc/hosts ファイルに次のエントリを追加します。
    127.0.0.1 <Host machine> ホストマシン:AEM Forms がデプロイされている Apple Mac マシン。

リファレンスフラグメント

フォームの作成に使用できる参照用アダプティブフォームフラグメントを使用できます。 詳しくは、リファレンスフラグメントを参照してください。

このページ