Best practices to design a Mobile form

This article lists some of the best practices for enabling a form template for HTML5 renditions. By following these guidelines, form developers can ensure that the behavior and appearance of Mobile Forms and XFA-based PDF is consistent.

Layout

  1. In new forms, add the non-interactive (Draw) elements before the interactive (Fields) elements. Add the elements in Hierarchy (Dom Order) if there is an overlap between them. Similarly, between overlapping Draw Text and other Draw elements (like Rectangle, Circle), put in Text after Rectangle so that it is visible. Avoid any overlap between Draw and Field.

  2. HTML5 rendition of Form Template does not embed any fonts. Avoid using fonts that you do not expect on your client computers or you risk a not so optimum rendition on the client devices.

  3. For Repeatable Subforms, mark the initial count as 1 or more. If you require zero initial instances, remove or hide the initial instance in form ready or initialize the script based on data. Also, add a check to ensure that the script not execute on the server end. The script should execute at the client end.  

  4. If you are using the deleteInstance function on formready state, add a server check to ensure that the script not executed on the server end. Execute the script at the client end.

    For example:

    if(xfa.host.name!= 'XFAPresentationAgent')
    _DynamicPage.removeInstance(0);

  5. If you are targeting the same form for both PDF and HTML, make sure that you protect the Acrobat-specific JavaScript by checking the environment type. Also ensure that you write equivalent scripts for the browser environment.

  6. If you have a hidden subform with a complex hierarchy that is split across pages, make the form visible at design time. Hide the form in the initialize script based on your logic.

Scripting

Mobile Forms contain a client-side XFA scripting library that supports form logic execution in both the scripting languages that the Adobe XFA Implementation supports: JavaScript and FormCalc.  This library includes implementation for most of the commonly used APIs on the client side. The list of supported APIs and Events can be found here.  If you need APIs that are not implemented yet, you can mark your script to run at server. Mobile Forms also support Web Service invocation from the client. The service runs on the server.

Mobile Forms and PDF forms support different set of features. For the complete list of features, see Feature differentiation between Mobile Forms and PDF Forms.

 Adobe

Get help faster and easier

New user?

Adobe MAX 2024

Adobe MAX
The Creativity Conference

Oct 14–16 Miami Beach and online

Adobe MAX

The Creativity Conference

Oct 14–16 Miami Beach and online

Adobe MAX 2024

Adobe MAX
The Creativity Conference

Oct 14–16 Miami Beach and online

Adobe MAX

The Creativity Conference

Oct 14–16 Miami Beach and online