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

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

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

フラグメントの作成

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

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

  1. https://[hostname]:[port]/aem/forms.htmlにあるAEM Forms作成者インスタンスにログインします。

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

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

    メモ

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

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

    • なし: フォームモデルを使用しないで最初からフラグメントを作成するときに指定します。
    • フォームテンプレート: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 参照:XSD ベースのアダプティブフォームにのみ表示されます。XDP フォームテンプレートの場所を表示します。

    save-fragment

    フラグメントとして保存ダイアログボックス

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

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

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

    フラグメントの編集

フラグメントの操作

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

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

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

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

  2. アダプティブフォームとインタラクティブコミュニケーションWebチャネル設定」を検索してクリックし、編集モードで開きます。

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

アダプティブフォームへのフラグメントの挿入

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

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

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

    すべてのアダプティブフォームフラグメントを表示することも、あるいはフォームモデル(フォームテンプレート、XML スキーマ、またはベーシック)に基づいてフィルタリングすることもできます。

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

    メモ

    アダプティブフォーム内で、アダプティブフォームフラグメントをオーサリング用として使用することはできません。また、JSON ベースのアダプティブフォームで XSD ベースのフラグメントを使用することも、XSD ベースのアダプティブフォームで JSON ベースのフラグメントを使用することもできません。

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

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

次のサンプル画像に示されているように、追加されたフラグメントのパネルツールバー上にある「アセット: <fragmentName> を埋め込む」ボタンをクリックすることで、アダプティブフォームフラグメントをアダプティブフォームに埋め込むことができます。

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

メモ

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

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

入れ子のアダプティブフォームフラグメントを作成できます。このことはフラグメント内に別のフラグメントをドラッグアンドドロップし、入れ子のフラグメント構造を構築できることを意味します。

フラグメントの変更

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

データバインディングのためのフラグメントの自動マッピング

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

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

メモ

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

フラグメントの管理

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

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

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

Operation

説明

次を開きます:

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

プロパティを表示

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

コピー

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

ダウンロード

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

プレビュー

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

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

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

辞書の作成

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

公開/非公開

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

削除

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

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

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

メモ

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

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

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

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

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

このページ

Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now