Documentation AEM as a Cloud Service User Guide

Create and use Adaptive Forms Fragments in an Adaptive Form

Last update: August 28, 2024

CREATED FOR:

User
Developer

Version	Article link
AEM as a Cloud Service (Foundation Components)	This article
AEM as a Cloud Service (Core Components)	Click here
AEM 6.5	Click here

While every form is designed for a specific purpose, there are some common segments in most forms, such as to provide personal details like name and address, family details, income details, and so on. Form developers are required to create these common segments every time a new form is created. Adaptive Forms provides a convenient mechanism to create form segment like a panel or a group of fields only once and reuse them across Adaptive Forms. These reusable and standalone segments are called Adaptive Form Fragments.

Create a fragment

You can create an Adaptive Form Fragment from scratch or save a panel in an existing Adaptive Form as fragment.

Create fragment from scratch

Log into AEM Forms author instance at https://[hostname]:[port]/aem/forms.html.
Click Create > Adaptive Form Fragment.
Specify title, name, description, and tags for the fragment.

NOTE
Ensure that you specify a unique name for the fragment. If there already exists another fragment with the same name, the fragment fails to create.
Click to open the Form Model tab, and from the Select From drop-down menu, select one of the following models for the fragment:
- None: Specifies to create the fragment from scratch without using any form model.
  
  NOTE
  In Adaptive Forms, you can use single form fragment (based on Core Components) multiple times in a form. It supports both none-based and schema-based form fragments.
- Form Template: Specifies to create the fragment using an XDP template uploaded to AEM Forms. Select the appropriate XDP template as the form model for the fragment.
The sub forms marked as fragments in the selected form template are also displayed. You can select a sub form for Adaptive Form Fragment from the drop-down list.

In addition, you can create an Adaptive Form Fragment using sub forms that are not marked as fragments in the form template by specifying the SOM expression for the sub form in the drop-down box.
- XML Schema: Specifies to create the fragment using an XML schema uploaded to AEM Forms. You can upload or select from the available XML schemas as the form model for the fragment.
You can also create an Adaptive Form Fragment by selecting a complexType present in the selected schema from the drop-down box.
Click Create and then click Open to open the fragment, with a default template, in edit mode.

In edit mode, you can drag-and-drop any Adaptive Form component from the AEM sidekick onto the fragment.

In addition, if you selected an XML schema or XDP form template as the form model for your fragment, a new tab displaying the form-model hierarchy appears in the content finder. It lets you drag-and-drop form-model elements onto the fragment. The added form-model elements get converted into form components while retaining the original properties from the associated XDP or XSD.

Save panel as a fragment

Open an Adaptive Form that contains the panel you want to save as Adaptive Form Fragment.
In the panel toolbar, click Save as Fragment. The Save As Fragment dialog opens.

NOTE
If the panel you are saving as fragment contains child panel, the resulting fragment will include them.
In the Fragment Creation dialog, specify the following information:
- Name: Name of the fragment. The default value is the element name of the panel. It is a mandatory field.
  
  NOTE
  Ensure that you specify a unique name for the fragment. If there already exists another fragment with the same name, the fragment fails to create.
- Title: Title of the fragment. The default value is the title of the panel.
- Description: Description of the fragment.
- Tags: Tags metadata for the fragment.
- Target Path: Repository path where the fragment is saved. If you do not specify a path, a node with the same name as that of the fragment gets created next to the node containing the Adaptive Form. The fragment is saved in this node.
- Form Model: Depending on the form model for the Adaptive Form, this field displays the XML Schema, Form Template, or None. It is a non-editable field.
- Fragment Model Root: Appears only in XSD-based Adaptive Forms. It specifies the root for the fragment model. You can choose / or the XSD complex type from the drop-down. You can reuse the fragment in another Adaptive Form only if you select the complex type as the fragment model root.
  If you choose / as the fragment model root, the complete XSD tree from the root is visible in the Adaptive Form Data Model tab. For a complex type fragment model root, only the descendants of the selected complex type are visible in the Adaptive Form Data Model tab.
- XSD Ref: Appears only in XSD-based Adaptive Forms. It displays the location of the XML schema.
- XDP Ref: Appears only in XDP-based Adaptive Forms. It displays the location of the XDP form template.
Save As Fragment dialog
Click OK.

The panel is saved at the specified or the default location in the repository. In the Adaptive Form, the panel is replaced by a snapshot of the fragment. As shown below, the General Information panel and its child panels, Personal Information and Address, are saved as a fragment.

To edit the fragment, click Edit Asset in the panel toolbar. The fragment opens in a new tab or window in edit mode.

Working with fragments

Configure fragment appearance

Any fragment you insert in Adaptive Forms appears as a placeholder image. The placeholder displays titles of up to a maximum of ten child panels in the fragment. You can configure AEM Forms to show the complete fragment instead of the placeholder image.

Perform the following steps to show complete fragments in forms:

Go to AEM web console configuration page at https:[host]:[port]/system/console/configMgr.
Search and click Adaptive Form Configuration Service to open it in edit mode.
Disable Enable Placeholder in place of Fragment checkbox to show complete fragments rather than the placeholder image.

Insert a fragment in an Adaptive Form

The Adaptive Form Fragments you create appear in the Adaptive Form Fragments tab of the AEM content finder. To insert an Adaptive Form Fragment in an Adaptive Form:

Open the Adaptive Form, in edit mode, in which you want to insert an Adaptive Form Fragment.
Click Assets in the sidebar. In the assets browser, select Adaptive Form Fragments from the drop-down.

You can also choose to display all Adaptive Form Fragments or filter based on their form model - Form Template, XML Schema, or Basic.
Drag-and-drop an Adaptive Form Fragment onto the Adaptive Form.

NOTE
The Adaptive Form Fragment is not enabled for authoring from within the Adaptive Form. Moreover, you cannot use an XSD-based fragment in a JSON-based Adaptive Form and the opposite way.

The Adaptive Form Fragment is inserted by reference in the Adaptive Form and is synchronized with the standalone Adaptive Form Fragment. It means when you update the Adaptive Form Fragment, the changes reflect in all Adaptive Forms where the fragment is used.

Embed a fragment in Adaptive Form

You can choose to embed an Adaptive Form Fragment in an Adaptive Form by clicking Embed Asset: <fragmentName> button on the panel toolbar of the added fragment, as shown in the following example image.

Embed a form fragment in Adaptive Form

NOTE

The embedded fragment is no longer linked with the standalone fragment. You can edit the components in the embedded fragment from within the Adaptive Form.

Using fragments within fragments

You can create nested Adaptive Form Fragments, which means you can drag-drop a fragment in another fragment, and can have nested fragment structure.

Change fragments

You can replace or change an Adaptive Form Fragment by another fragment by using the Select Fragment asset property in the Edit component dialog for an Adaptive Form Fragment panel.

Using a form fragment multiple times in an Adaptive Form

You can use a schema-based form fragment multiple times in an Adaptive Form to save data uniquely for each form fragment fields. For example, you can use an address form fragment to collect address details for permanent, communication, and present living addresses in a loan application form.

using multiple fragment in adaptive form

NOTE

If you use none-based form fragments multiple times in an Adaptive form, data synchronization issue between the fields of the fragments occurs. You can use a core component based form fragment that is not tied to any form data model (FDM), multiple times in a form without experiencing data synchronization issues.

Auto mapping of fragments for data binding

When you create an Adaptive Form Fragment using an XFA form template or XSD complex type and drag-drop the fragment to an Adaptive Form, the XFA fragment or the XSD complex type is automatically replaced by the corresponding Adaptive Form Fragment whose fragment model root is mapped to the XFA fragment or XSD complex Type.

You can change the fragment asset and its bindings from the Edit component dialog.

NOTE

You can also drag-drop a bound Adaptive Form Fragment from Adaptive Form Fragment library in AEM content finder and provide the correct bind reference from the Edit component dialog of the Adaptive Form Fragment panel.

Manage fragments

You can perform several operations on Adaptive Form Fragments using the AEM Forms UI.

Go to https://[hostname]:'port'/aem/forms.html.
Click Select in the AEM Forms UI toolbar and select an Adaptive Form Fragment. The toolbar displays the following operations you can perform on the selected Adaptive Form Fragment.

Operation	Description
Open	Opens the selected Adaptive Form Fragment in edit mode.
View Properties	Opens the Properties panel. From the Properties panel, you can view and edit properties, generate a preview, and upload a thumbnail image for the selected fragment. For more information, see Managing metadata.
Copy	Copies the selected fragment. The Paste button appears in the toolbar.
Download	Downloads the selected fragment.
Preview	Provides options to preview the fragment as an HTML or a custom preview by merging data from an XML file with the fragment.
Start Review/Manage Review	Allows initiating and managing a review of the selected fragment.
Create Dictionary	Generates a dictionary for localizing the selected fragment.
Publish / Unpublish	Publishes / unpublishes the selected fragment.
Delete	Deletes the selected fragment.

Localizing Adaptive Form containing fragments

To localize an Adaptive Form that contains Adaptive Form Fragments, you need to localize the fragment and the form separately. The idea is to localize a fragment once and reuse it in multiple Adaptive Forms.

NOTE

The localization keys in the fragment won’t appear in the XLIFF file for an Adaptive Form.

Key points to remember when working with fragments

Ensure that the fragment name is unique. The fragment fails to create if there is an existing fragment with the same name.
In an XDP-based Adaptive Form, if you save a panel as fragment that includes another XDP fragment, the resulting fragment is automatically bound to the child XDP fragment. In case of an XSD-based Adaptive Form, the resulting fragment is bound to the schema root.
When you create an Adaptive Form Fragment, a fragment node gets created, which is similar to the guideContainer node for an Adaptive Form, in CRXDe Lite.
A fragment in an Adaptive Form that uses a different Form Data Model (FDM) is not supported. For example, an XDP-based fragment is not supported in an XSD-based Adaptive Form and conversely.
Adaptive Form Fragments are available for use through the Adaptive Form Fragments tab in AEM content finder.
Any expression, script, or style in a stand-alone Adaptive Form Fragment is retained when it is inserted by reference or embedded in an Adaptive Form.
You cannot edit an Adaptive Form Fragment, which is inserted by reference, from within an Adaptive Form. To edit, you either edit the stand-alone Adaptive Form Fragment or embed the fragment in the Adaptive Form.
When you publish an Adaptive Form, you need to publish the standalone Adaptive Form Fragments inserted by reference in the Adaptive Form.
When you republish an updated Adaptive Form Fragment, the changes reflect in the published instances of the Adaptive Form in which the fragment is used.
Adaptive Form containing the Verify component does not support anonymous users. Also, it is not reommended to use the Verify component in an Adaptive Form Fragment.
(Mac only) To ensure that the form fragments functionality works perfectly in all the scenarios, add the following entry to the /private/etc/hosts file:
127.0.0.1 <Host machine> Host machine: The Apple Mac machine on which AEM Forms is deployed.

recommendation-more-help