Missing Adaptive Form Features

You may see instances where adaptive form features are not working. For example, in this illustration, we see a missing Action bar. When we select an adaptive form, as we have done here, we should see the action bar in the area outlined in red (see illustration).

There are a few things you can try to fix this, but the first step is to check your adaptive form bundles. Follow these steps.

1. Login to AEM as an administrator.

2. Open Web Console Bundles.

http://<server>:<port>/system/console/bundles

3. Confirm that all AEM Forms bundles are active. You should see a message like this (see illustration). You may have more or fewer bundles, but the key point is to see if you have any bundles that are not in an active state.

4. Consider the next screenshot. As you can see, there are 15 bundles in a Resolved state and 11 bundles in an Installed state. None of these are Active. You can also see that these are AEM Form bundles. Notice strings like AEMFD and AEM Forms in the names of the bundles that are not active.

5. When you see AEM Form bundles that are not active, click Start (outlined in red) to move them to an active state.

6. After the AEM Forms bundles are in an Active state, you will likely see all the expected AEM adaptive form features and functionality restored.

Inaccurate JavaScript Display in Rules Editor

An adaptive form’s JavaScript will not always display properly in the Rules Editor. Notice that the top screenshot is not displaying the complete JavaScript that is shown in the bottom screenshot. The bottom screenshot shows a block of code highlighted in purple that is not displayed in the top screenshot.

2 screenshots showing inaccurate JavaScript display in the AEM Forms Rules Editor

Value Commit Fires Programmatically

This example shows how the Value Commit event of a drop-down field fires.

1. Put this script into the Value Commit event of a drop-down field called selectName.

console.log("The Value Commit event of the drop-down fires.");

2. Put this script into the Initialize event of a different field that sets the value of selectName.

selectName.value = "JPT";

3. When your preview the form, the Initialize event fires and our script is run, AND the Value Commit event on the drop-down also fires and our string is written to the console log.

The Browser's Developer Console

If you only want the Value Commit event on the drop-down to fire when a user clicks the drop-down, you can follow these steps to change the behavior.

1. Login to your server and go to Web Console Configuration.

http://<servername>:4502/system/console/configMgr

2. Search for Adaptive Form and Interactive Communication Web Channel Configuration.name

3. Click Edit the configuration values (the pencil icon).

4. Click the drop-down and switch from None to AEM Forms 6.1.

AEM Web Console showing the Adaptive Form and Interactive Communication Web Channel Configuration.name panel

Erroneous Electronic Signature Error

AEM Forms 6.5.6 has an erroneous electronic signature error. You may see adaptive forms that were perfectly fine before start to show this erroneous error in AEM Forms 6.5.6

Erroneous Electronic Signature Error in AEM Forms
  • Software Version: AEM Forms 6.5.6
  • AEM Forms add-on package: adobe-aemfd-win-pkg-6.0.192.zip
  • Steps to Recreate: It is sporadic; you may see it on some adaptive forms and not others.
  • Suggested Work Around: Ignore it and hope the next service pack solves it.

<p> tags in Help Content

Oftentimes, the Done button is missing from the Side Panel in AEM Forms 6.5.5 (A). This is not always the case but the problem occurs often enough to slow down efficiency. This issue did not occur in earlier versions but it does occur in the 6.5.5 version that came out on June 4th, 2020.

When you edit the property values of a field, you should see a Done button. The button will be in an inactive (grayed-out) state but will become active (blue background) after you update the values in the Side Panel (B).

Unfortunately, there are many instances when the button does not appear at all (A). You can only solve this by proceeding to your next form field edit. When you start a new form field edit, AEM will prompt you to save changes on your previous edit and the Done button will become visible (C).

paragraph tags in Help Content of AEM Forms
  • Software Version: AEM Forms 6.5.5.0
  • AEM Forms add-on package: adobe-aemfd-win-pkg-6.0.160.zip
  • Steps to Recreate: Create an AEM adaptive form and update property values in the side panel. The issue will not always occur but will likely occur a few times if you are working in AEM Forms all day.
  • Suggested Work Around: Avoid using verions 6.5.5. Upgrade to the 6.5.6 version where the issue is fixed.

Missing Done Button

Oftentimes, the Done button is missing from the Side Panel in AEM Forms 6.5.5 (A). This is not always the case but the problem occurs often enough to slow down efficiency. This issue did not occur in earlier versions but it does occur in the 6.5.5 version that came out on June 4th, 2020.

When you edit the property values of a field, you should see a Done button. The button will be in an inactive (grayed-out) state but will become active (blue background) after you update the values in the Side Panel (B).

Unfortunately, there are many instances when the button does not appear at all (A). You can only solve this by proceeding to your next form field edit. When you start a new form field edit, AEM will prompt you to save changes on your previous edit and the Done button will become visible (C).

Missing Done button in AEM Forms
  • Software Version: AEM Forms 6.5.5.0
  • AEM Forms add-on package: adobe-aemfd-win-pkg-6.0.160.zip
  • Steps to Recreate: Create an AEM adaptive form and update property values in the side panel. The issue will not always occur but will likely occur a few times if you are working in AEM Forms all day.
  • Suggested Work Around 1: Upgrade to the 6.5.6 version where the issue is fixed.
  • Suggested Work Around (in 6.5.5): Since you cannot click Done to commit your updates, simply proceed to the next step in your exercise. AEM will remind you that you did not click Done (C) and will give you the opportunity to save your updates. upgrade to the 6.5.6 version where the issue is fixed.

Make a new action and you will trigger the Done button.

The Done button is missing in Adobe AEM Forms

Unable to Create Child Panels

Some users are not able to create child panels in an adaptive form. When trying to create a child panel of the guideRootPanel, they will see the Name property highlight in red and they will not be able to complete the panel.

Adobe AEM Forms unable to create child panel
  • Software Version: AEM Forms OSGi 6.4, AEM Forms JEE 6.4
  • AEM Forms add-on package: adobe-aemfd-win-pkg-5.1.42.zip
  • Steps to Recreate: Install AEM Forms 6.4 and the AEM Forms add-on package. Create a child panel.
  • Suggested Work Around: Create the child panels in CRXDE Lite.

Solution

Follow these steps to create child panel nodes in CRXDE Lite.

1. Select Develop in CRXDE Lite.

2. Locate your adaptive form's rootPanel.

3. Expand the items node.

4. Copy and Paste as many child panel nodes as you need.

Create Child Panels nodes in CRXDE Lite

5. Enter the name of your panel in the jcr:title property.

6. Click Save All.

7. Go back to AEM Forms and Refresh.

8. You can now work on your new child panels.


Verify Component Fails

Note: This was solved in the updated AEM-Forms-6.5.2.0-WIN-6.0.106.zip package that was released in September, 2019.

The Verify Component produces an erroneous error in AEM Forms 6.5.1.0 and the AEM Forms add-on package that came out on July 2nd, 2019. I have seen this error message with auto-generated Documents of Record and with XDP-based adaptive forms.

The AEM Forms Verify Component does NOT WORK in 6.5.1.0
  • Software Version: AEM Forms OSGi 6.5.1.0
  • AEM Forms add-on package: adobe-aemfd-win-pkg:6.0.88
  • Steps to Recreate: Use the Verify component in an adaptive form.
  • Suggested Work Around: Use an earlier version of the AEM Forms add-on package or install the updated AEM-Forms-6.5.2.0-WIN-6.0.106.zip package that was released in September, 2019.

Verify Component Changes Data

The Verify Component changes the data structure of submitted adaptive form data.

In this example, we start with an adaptive form bound to an XDP (XML Data Packet) file. The XDP file is bound to an XML Schema with a root node of /expenseReport (highlighted in blue). When the adaptive form is submitted, the submitted data is wrapped in /afData/afBoundData wrappers (see illustration).

AEM Forms adaptive form data wrappers

However, after the Verify component is used, the /afData/afBoundData wrappers becomes stripped from the submission. Here is how the submitted data looks when the Verify component is used on the adaptive form.

AEM Forms XDP data wrappers

Without instantiating the Verify Component, the structure is: /afData/afBoundData/xdp/datasets/data/expenseReport

When the Verify Component is substantiated, the structure is: /xdp/datasets/data/expenseReport


Field Validation Distorts Layouts

The Form Field validation in adaptive forms will distort the layouts you create in Layout Mode. Notice how this layout has three fields per row for the Desktop target of Layout Mode. It works fine until the form validation kicks in.

AEM Forms Layout mode issue with validation

After proper data is entered into the Email field, and the field passes validation, the layout is distorted by a large blank white gap. Adobe has confirmed this issue in AEM Forms Layout Mode.

AEM Forms layout mode gaps in layout
  • Software Version: AEM Forms OSGi 6.5.2
  • AEM Forms add-on package: adobe-aemfd-win-pkg:6.0.106
  • Steps to Recreate: Create an adaptive form with the layout illustrated above.
  • Suggested Work Around: You have 2 good options. The first is to use JavaScript validation until this bug is solved. The second is to put the subsequent form fields on a sub panel. I can solve the example above by putting the Address field and the Today’s Date field on a sub panel.

Number of Columns Missing in 6.5

The Number of Columns property is missing in AEM Forms 6.5 and the AEM Forms add-on package that came out on July 2nd, 2019. Although you can fix it by changing the sling:resourceType property of your panel, it is a better idea to start using AEM’s Layout mode for your adaptive forms. Both techniques are detailed here.

The The Number of Columns Property is Missing in AEM Forms 6.5
  • Software Version: AEM Forms OSGi 6.5
  • AEM Forms add-on package: adobe-aemfd-win-pkg:6.0.88
  • Steps to Recreate: Try to access the Number of Columns property on an adaptive form.
  • Suggested Work Around #1: Start using AEM's Layout mode (Recommended)
  • Suggested Work Around #2: Follow the steps below in CRXDE|Lite (Not Recommended)

Solution #1: Use Layout Mode

If you are using AEM Forms 6.5 or greater, consider using AEM's Layout mode for your multi-column layouts. If you have used Layout mode in AEM Sites, you will already be familiar with Layout mode in AEM Forms. Simply switch from Edit mode to Layout mode and follow the same layoutting techniques that we use in AEM Sites. These steps are covered in detail in our AEM Forms Developer Student Manual.

Adobe AEM Forms Layout mode

Solution #2: Edit in CRX

Follow these steps to change the sling:resourceType property of your panel.

1. Open CRXDE | Lite.

2. Search for your form's panel.

Note: The illustration below shows a search for the "Foia Application" panel. This is only an example. This is an Adobe example form and it does not have the bug problem.

3. Select the result that points to your panel.

Note: The illustration below shows a result that points to the "Foia Application" panel. Here is the complete path for this example node: /content/forms/af/we-gov/foia-request-form/jcr:content/guideContainer/rootPanel/items/1475752223586

Change the sling:resourceType property of your panel

4. Select the layout node of your panel.

5. If the sling:resourceType property of your layout node is "fd/af/layouts/gridFluidLayout2", change it to "fd/af/layouts/gridFluidLayout".

6. Click Save All.

7. Go back to AEM Forms and you will see the Number of Columns property on your panel.

Number of Columns property is missing in AEM Forms. This images shows the correction.

Unable to Edit Forms

You may be unable to edit forms after installing certain AEM Forms Reference Sites. These reference sites lock the interactive and editable features in AEM Forms. Normally, when you select an adaptive form object you should see a blue outline and an interactive toolbar (B). However, when the bug is present, you will not see the editable and interactive features when you select a form object (A). The form object will appear to be locked.

Interactive and editable adaptive forms

This error does NOT occur after installing the 6.4 version of the WE.GOV application. However, it does occur after installing these Adobe Reference sites:

  • The 6.5 version of the WE.GOV application (version 5.0.4 shown here)
  • Older versions of the WE.FINANCE site

If you see the above issue, try uninstalling these applications and then refresh your adaptive form in Edit mode. You should see the interactive and editable controls return to the form.

uninstall adobe we.gov sample application

  • Software Version: various, but most recently on AEM Forms 6.5.7
  • AEM Forms add-on package: various
  • Steps to Recreate: Install the 1.0.4 version of the we-gov-forms package
  • Solution: Uninstall the 1.0.4 version of the we-gov-forms package

Unable to Create Child Panels

This error occurs some times when creating child panels in the Initial Content view of the Template Editor. It is a known Adobe bug (NPR-34402). As shown here, when you select the Root Panel and click Add Child Panel, you will some times receive this error.

AEM Forms adaptive form template error unable to create child panels

When you check the browser console, you will see that the core.js has this error: editConfigListeners is not defined.

An Adaptive form template error shown in the JavaScript Console
  • Software Version: AEM Forms 6.5.3, 6.5.4, 6.5.5
  • AEM Forms add-on package: various
  • Steps to Recreate: Create an adaptive form template and add child panels in the Initial content mode.
  • Solution: Install the 6.5.7 update

RecursionTooDeepException when creating templates

This error also occurs some times when creating child panels in the Initial Content view of the Template Editor. This will cause the server to slow and then stop. You can see the exception in the error.log.

RecursionTooDeepException while creating AEM Forms templates
  • Software Version: AEM Forms 6.5+
  • AEM Forms add-on package: various
  • Steps to Recreate: Create an adaptive form template and add child panels in the Initial content mode. This error only occurs occasionally.
  • Solution: Delete problematic template and create a new template.

Can't select Text Box

The issue occurs when you can't select a Text Box in Edit mode. As shown here, the Text Box cannot be select. The Root Panel has two child components; a Drop-down List, and a Text Box. The Drop-down List can be selected (a). But, when an Author tries to select the Text Box, the Root Panel is selected instead (b).

Adobe AEM Forms Text Box not working
  • Software Version: AEM Forms 6.5
  • AEM Forms add-on package: various
  • Steps to Recreate: Create an adaptive form template and add two child components; a Drop-down List, and a Text Box. If you can select the Drop-down List but not the Text Box, see the notes under solution for a likely reason.
  • Solution: Make sure there are no overlays in /apps/ that will prevent the standard guidetextbox from being used. For instance, this overlay can cause the issue. If you see this, simply delete the overlay in /apps/.
adobe aem forms custom text box overlay

We-Finance sample application adds data nodes at runtime

You may see extra data nodes added to your adaptive form output data. These extra data nodes are added at runtime and caused by the We-Finance Adobe Sample application. You will see extra data nodes wrapped in a node called <mortgageWelcomeKit>.

<?xml version="1.0" encoding="UTF-8"?>
<mortgageWelcomeKit>
    <CustomerName>Sarah</CustomerName>
    <CardType>Platinum</CardType>
    <CustomerID>635489215</CustomerID>
    <textbox>J.P. Terry</textbox>
</mortgageWelcomeKit>

To solve the problem, simply uninstall this package.

Adobe's We Finance sample application

Welcome to aemforms.training.

If you are a subscriber, you can login and access the latest, and greatest, Adobe AEM Forms training courseware and support. If you are not yet a subscriberemail us today and we'll set you up with a demo of our online eLearning tools for Adobe AEM Forms.