Form Layout

Create a complete Order review form with editable fields, totals, validation, revalidation, and approval actions.

Create the form used to compare an order with its PDF, correct extracted values, revalidate the document, and complete approval.

For the general UI procedures, see Form Layouts, Form Layout Sections, Lookups and Dropdowns, Document Actions, and Related Tabs and AI Insight.

Prerequisites

Before you start, complete the Document Type, Business Rules, Approval and Rejection, and State Transitions. Confirm that invoice-save-action, business-rules-supervisor, invoice-approval-engine, and document-status-state-machine appear in cloud-function selectors.

Creating the layout

1

Open Form Layouts

In the Document Intake Cockpit, open Configuration → Form Layouts. Select New layout.

2

Enter layout details

Set Name (EN) to Order and Document type to ORDER_INTAKE.

New form layout with name and document type

3

Configure Errors

Open Errors. Set Validation panel position to Inline (top of Details tab, above fields) and Validation box when successful to Hide when validation is successful.

Leave Error field empty for the baseline flow. The required-company rule appears in the validation panel. Configure a separate red Errors panel only when your implementation writes process messages to a schema field.

Errors with Validation box position

4

Build form sections

On Form Sections, add the five sections and fields from Form field configuration. Keep all sections Expanded for the first test.

Form Sections editor. This walkthrough uses text controls first. Replace them with dropdowns only in Optional reference lookups.

5

Add document actions

On Document Actions, add the six actions from Action configuration. The Save cloud-function action stores edits. Revalidate is separate because saving does not rerun business rules.

Document Actions editor. Add all six actions from the table, including Save and Approval.

6

Save the layout

Select Save.

Form field configuration

Add these scalar fields:

Section	Binding	Control	Label	Width
Customer	header.customer.id	text	Customer ID	½
Customer	header.customer.name	text	Customer Name	½
Customer	header.customer.email	email	Customer Email	Full
Customer	header.customer.address.street	text	Street	Full
Customer	header.customer.address.city	text	City	½
Customer	header.customer.address.country	text	Country	½
Company	header.company.id	text	Company ID	½
Company	header.company.name	text	Company Name	½
Shipping Address	shippingAddress.street	text	Street	Full
Shipping Address	shippingAddress.city	text	City	½
Shipping Address	shippingAddress.country	text	Country	½
Totals	header.currency	text	Currency	½
Totals	total	currency	Order Total	½

For Order Total, set Currency field to header.currency.

In Line Items, add one field bound to lineItems with control table and label Line Items. Add these table columns:

Field path	Header label	Type
id	Product ID	text
name	Name	text
sku	SKU	text
quantity	Quantity	number
unitPrice	Unit Price	number
tax	Tax	number
amount	Net Amount	number
totalPrice	Total Price	number

Enable Show summary row to help compare line totals with Order Total. The summary does not write a value to total. Table-column currency bindings resolve inside each line-item row, so this baseline uses number for line amounts and formats only the top-level Order Total as currency.

Action configuration

Add actions in this order:

Action type	Label	Visibility	Additional configuration
Edit	Default	Preview mode only	Secondary
Cancel	Default	Edit mode only	Secondary
Cloud function	Save	Edit mode only	Select invoice-save-action; enable Refresh document after execution and Switch to preview mode after execution; use Primary
Refresh	Default	Preview mode only	Secondary
Cloud function	Revalidate	Preview mode only	Add business-rules-supervisor, then document-status-state-machine; enable Refresh document after execution
Approval	Default	Preview mode only	Add invoice-approval-engine, then document-status-state-machine; choose Approve or reject; enable Refresh document after execution

For Approval, set Visibility condition to:

document.mixins.documentMetadata.status == 'PENDING_APPROVAL'

This hides approval until validation succeeds and the document enters Pending Approval.

Configure Save as a Cloud function action that uses invoice-save-action. Do not select the Save action type. Keep business-rules-supervisor on the separate Revalidate action.

Optional reference lookups

The text controls above make the baseline workflow testable without another data source. After it works, replace:

• Customer ID with a dropdown that stores the customer ID and populates name, email, and address.

• Company ID with a dropdown that stores the company ID and populates company name.

• Product ID with a lookupModal table column that stores the product ID and populates SKU and name.

Configure and test each source URL as described in Lookups and Dropdowns. Add a Customer related tab only after header.customer.id reliably contains the ID used by its fetch URL.

Checkpoint

After you open Manage on an Order, check that the form, validation, and approval match this example:

• The five sections and all fields appear beside the source document.

• Edit opens editable controls; Cancel discards changes; Save stores changes and returns to preview.

• Revalidate is available in preview.

• Approval is hidden until the status is Pending Approval.

• Revalidate advances a parsed document to Validation Errors or Pending Approval, based on the saved validation result.

• After successful validation, Pending Approval appears as the status and the selected matrix's first approver appears as Assignee.

• Approval advances Pending Approval to Approved or Rejected, based on the saved decision.

Next, create the Orders Queue.