Debugging HTML5 forms

This document includes several troubleshooting scenarios. For each scenario, some steps are provided to troubleshoot the problem. Follow these steps and, if the problem persists, configure the Logger to get and review logs for errors/warnings. For more details about HTML5 forms logging, see Generating Logs for HTML5 forms.

Problem: When rendering the form, I see org.apache.sling.api.SlingException exception page

In the exception details, search for word caused by.

The probable reason is that one or more parameters in the URL are incorrect.

Check the following parameters:

Problem: Unable to render a form (an error message is displayed)

1. Ensure that the specified parameters are correct. For detailed information on parameters, see Render Parameters.

2. Log in to CRX Package Manager(at https://<server>:<port>/crx/packmgr/index.jsp) and check whether the following packages are correctly installed:

   • adobe-lc-forms-content-pkg-<version>.zip
   • adobe-lc-forms-runtime-pkg-<version>.zip

3. Log in to CQ Web Console (Felix Console) at https://<server>:<port>/system/console/bundles.

   Ensure that the status of the following bundles is “active”:

   • scala-lang.bundle [osgi]

   (com.adobe.livecyclescala-lang.bundle)

   • Adobe XFA Forms Renderer

   (com.adobe.livecycle.adobe-lc-forms-core)

   • Adobe XFA Forms LC Connector

   (com.adobe.livecycle.adobe-lc-forms-lc-connector)

Problem: Form renders without styles

1. In your browser, open Developer Tools. Ensure that profile.css is available.

2. If the profile.css file is not available, login to CRX DE at https://<server>:<port>/crx/de.

3. In the folder hierarchy on the left, navigate to /etc/clientlibs/fd/xfaforms/. Open css.txt files listed in the folders.

   • profile
   • runtime
   • scrollnav
   • toolbar
   • xfalib

4. Verify that the files mentioned inside the css.txt are present in CRX DE lite at /libs/fd/xfaforms/clientlibs/xfalib/css.

   #base=css
   application.css
   dialog.css
   datepicker.css
   scribble.css
   listboxwidget.css
   

5. If the mentioned files are not available, install the adobe-lc-forms-runtime-pkg-<version>.zip package again.

Problem: Unexpected error encountered

1. In the form URL, add a query parameter debugClientLibs and set its value to true (For example: https://<server>:<port>/content/xfaforms/profiles/test.html?contentRoot=<some path>&template=<name of xdp file>&log=1-a9-b9-c9&debugClientLibs=true)

2. In the desktop browser like chrome, go to Developer Tools -> Console.

3. Open the logs to identify the type of error. For detailed information on logs, see logs for HTML5 forms.

4. Go to Developer Tools -> Console. Use stack trace to locate the code which is causing the error. Debug the error to resolve the issue.

   NOTE

   If it is scripting failure, check if the same problem occurs during the PDF rendition of the form as well. If yes, then there is a problem in the form scripting logic.

Problem: Unable to submit the form

1. Ensure that you have rights to access the AEM server and you are connected to the server.
2. Check that the parameter submitUrl is correct.
3. Enable the client side logs as mentioned at Logs for the HTML5 forms using debug option as 1-a5-b5-c5. Then render the form and click submit. Open browser debug console and check if there is an error.
4. Locate the server logs as mentioned at Logs for the HTML5 forms. Check if there was any error in server logs during submission.

Problem: Localized error messages do not display

1. Render the form with additional query parameter debugClientLibs=true in the desktop browser, and then go to Developer Tools -> Resources and check for the file I18N.css.

2. If the file is not available, login into CRX DE at https://<server>:<port>/crx/de.

3. In the folder hierarchy on the left, navigate to /libs/fd/xfaforms/clientlibs/I18N and ensure that the following files and folders exist:

   • Namespace.js
   • LogMessages.js
   • Folders for languages

4. If any of the above files or folders do not exist, install the adobe-lc-forms-runtime-pkg-<version>.zip package again.

5. Navigate to the folder which has the same name as the name of the locale and check its content. The folder must contain the following files:

   • I18N.js
   • js.txt

6. Check the content of js.txt and make sure that it has the following entries.

   ../Namespace.js
   I18N.js
   ../LogMessages.js
   

Problem: Image not showing up

1. Ensure that the image URL is correct.

2. Check if your browser supports this type of image.

3. In the exception details, search for word caused by.

   The probable reason is that one or more parameters in the URL are incorrect.

   Check the following parameters:
   Step text

1. In the desktop browser, go to Developer Tools -> Resources.

   Check on the left side in Frames if that image displays.

Business.Adobe.com resources

Ecommerce Integrations Style System Personalized Experiences Content As A Service Version History Digital Signage