Free cookie consent management tool by TermsFeed

Form Layout

Function

a!formLayout( label, instructions, contents, buttons, validations, validationGroup, skipAutoFocus, showWhen )

Displays any arrangement of layouts and components beneath a title and above buttons. Use this as the top-level layout for start and task forms.

See also: Dashboard, Columns

Parameters

Name Keyword Types Description

Label

label

Text

Optional text to display as the interface's title.

Instructions

instructions

Text

Optional text displayed below the field's label.

Contents

contents

Any Type Array

Components and layouts to display in the form body.

Buttons

buttons

Button Layout

Buttons to display at the bottom of the form, arranged using a!buttonLayout().

Validations

validations

Text or Validation Message

Validation errors displayed above the form buttons. Configured using a text array or an array with a mix of text and Validation Message using a!validationMessage(message, validateAfter).

Validation Group

validationGroup

Text or Validation Message Array

When present, the requiredness of the field is only evaluated when a button in the same validation group is pressed. The value for this parameter cannot contain spaces. For example, “validation group” is not a valid value. You need to add an underscore between words: “validation_group”. See the following recipes for more information:

Don’t automatically focus on first input

skipAutoFocus

Boolean

Determines whether the first input will receive focus when a form loads. Default is false.

Visibility

showWhen

Boolean

Determines whether the layout is displayed on the interface. When set to false, the layout is hidden and is not evaluated. Default: true.

Usage considerations

Using a!formLayout()

  • A button layout must be present for a back button to appear for activity-chained tasks.
  • Use form validation messages for problems that are not specific to a single component.
  • This component cannot be read-only or disabled.

Initial behavior & focusing

Scroll behavior in wizards

When you use a form layout as part of a wizard, Appian will automatically handle the page scrolling between each step of the wizard. This means that whenever a user navigates to the next step, the page will automatically scroll to the top of the form.

However, there are certain scenarios where Appian will not automatically handle page scrolling. If your form contains multiple read-only components—elements that the user does not interact with—then the automatic page scrolling may not occur when the user navigates to the next step. Additionally, the buttons or dynamic links that control form navigation must be placed in the buttons parameter. If they are placed in the contents parameter, auto scrolling will not work.

Examples

To experiment with examples, copy and paste the expression into an interface object.

Two-column form

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56

a!formLayout(
  label: "Customers for Review",
  instructions: "Review the profiles for the customers below and contact as needed",
  contents: {
    a!columnsLayout(
      columns: {
        a!columnLayout(
          contents: {
            a!textField(
              label: "Customer",
              value: "John Smith",
              readOnly: true
            ),
            a!textField(
              label: "Status",
              value: "Prospective",
              readOnly: true
            ),
            a!textField(
              label: "Priority",
              value: "High",
              readOnly: true
            )
          }
        ),
        a!columnLayout(
          contents: {
            a!textField(
              label: "Customer",
              value: "Michael Johnson",
              readOnly: true
            ),
            a!textField(
              label: "Status",
              value: "Prospective",
              readOnly: true
            ),
            a!textField(
              label: "Priority",
              value: "Medium",
              readOnly: true
            )
          }
        )
      }
    )
  },
  buttons: a!buttonLayout(
    primaryButtons: {
      a!buttonWidget(
        label: "Submit",
        submit: true
      )
    }
  )
)

Displays the following:

screenshot of a two-column form

Feature compatibility

The table below lists this component's compatibility with various features in Appian.
Feature Compatibility Note
Portals Compatible
Offline Mobile Compatible
Sync-Time Custom Record Fields Incompatible
Real-Time Custom Record Fields Incompatible

Custom record fields that evaluate in real time must be configured using one or more Custom Field functions.
Process Reports Incompatible

Cannot be used to configure a process report.
Process Events Incompatible

Cannot be used to configure a process event node, such as a start event or timer event.

Old versions

There are older versions of this interface component. You can identify older versions by looking at the name to see if there is a version suffix. If you are using an old version, be sure to refer to the corresponding documentation from the list below.

Old Versions Reason for Update
a!formLayout_17r1

Replaced firstColumnContents and secondColumnContents with contents. Now supports greater than two-column layout.

To learn more about how Appian handles this kind of versioning, see the Function and Component Versions page.

The following patterns include usage of the Form Layout.

Feedback