ÃÛ¶¹ÊÓƵ

Space saving: An accordion allows users to expand and collapse sections of a form, reducing the amount of space needed to display all the form fields at once.

Navigation: An accordion can be used to create a hierarchical navigation structure, making it easier for users to find the form fields they need.

User experience: Accordion can be used to make the form more user-friendly by providing a clear and intuitive way for users to access and fill in form fields.

Long Forms: Accordion is an ideal component to handle long forms, as it allows users to focus on one section at a time, rather than trying to process a lot of information all at once.

The configure dialog to specify properties of the accordion component.

The Select panel popover to define the order of the panels of the accordion. This allows the author to arrange the panels in the order the panels should appear.

Options for a forms author to enable or disable certain features in the design dialog. For example, an author may choose to disable certain fields or sections of a form. These options allow the author to have greater control over the form’s design and functionality, making it easier to create forms that are tailored to the specific needs of the organization.

Name - You can identify a form component easily with its unique name both in the form and in the rule editor, but the name must not contain spaces or special characters.

Title - With its Title, you can easily identify a component in a form and by default, the title appears on top of the component. If you do not add a title, the name of the component is displayed instead of the title text.

Allow Rich Text for Title - This features enables users to format plain text titles, incorporating features like bold, italic, underlined text, various fonts, font sizes, colors, and additional option to enhance visual presentation and customization. It offers greater flexibility and creative control in making titles stand out within documents, websites, or applications.
Upon selecting the checkbox for Allow Rich Text for Title , formatting options become visible to style the component’s title. To access all available formatting options, you can click on the tab.

Hide Title - Select the option to hide the component’s Title.

Group child components’ data on form submission(Wrap data in object) - When the option is selected, the data from its child components is nested within the parent component’s JSON object. However, if the option is not selected, the submitted JSON data has a flat structure, with no object for the parent component. For example:

• When the option is selected, the data from the child components (for example, Street, City, and Zip Code) is nested within the parent component (Address) as a JSON object. This creates a hierarchical structure, and the data is organized under the parent component.

  Structure of submitted data:

  code language-json
  { "Address": { "Street": "123 Main Street", "City": "New York", "Zip Code": "12345" } }

• When the option is not selected, the submitted JSON data has a flat structure with no object for the parent component (Address). All data is at the same level, without any hierarchical organization.

  Structure of submitted data:

  code language-json
  { "Street": "123 Main Street", "City": "New York", "Zip Code": "12345" }

Bind Reference - A bind reference is a reference to a data element that is stored in an external data source and used in a form. The bind reference allows you to dynamically bind data to form fields, so that the form can display the most up-to-date data from the data source. For example, a bind reference can be used to display a customer’s name and address in a form, based on the customer’s ID entered into the form. The bind reference can also be used to update the data source with data entered into the form. In this way, AEM Forms enables you to create forms that interact with external data sources, providing a seamless user experience for collecting and managing data.

Hide Component - Select the option to hide the component from the form. The component remains accessible for other purposes, such as using it for calculations in the Rule Editor. This is useful when you need to store information that doesn’t need to be seen or directly changed by the user.

Disable Component - Select the option to disable the component. The disabled component is not active or editable by the end user. The user can see the value of the field but cannot modify it. The component remains accessible for other purposes, such as using it for calculations in the Rule Editor.

Read-only - Select the option to make the component non-editable. The user can see the value of the field but cannot modify it. The component remains accessible for other purposes, such as using it for calculations in the Rule Editor.