Skip to main content

1. Form control details

An Approval form is composed of various controls, grouped into three categories:

1) Layout controls

Column split improves information density on the desktop by arranging Form Fields into multiple columns side by side.
Column split takes effect only on the desktop; the mobile side still displays in a single column. This control has no Attribute Settings, data constraints, or Search.
Column split control in the control library:
Column split control in the control library
Use Column split to organize fields in the form designer:
Using Column split to organize fields in the form designer
Column split as it appears on a desktop form:
How Column split appears on a desktop form

2) Basic controls

Basic controls share the following common settings:

1. Single-line input

Use this control to enter simple Text, such as a contract name or item name. Settings interface Add a single-line input in the form designer:
Adding a single-line input in the form designer
Single-line input Attribute Settings panel:
Single-line input Attribute Settings panel
Single-line input as it appears on a mobile form:
How the single-line input appears on a mobile form
Attribute Settings The single-line input recognizes Links and Markdown-formatted Content:
The single-line input recognizes Links and Markdown-formatted Content
Entered Content as it appears on the Approval detail Page:
How the entered Content appears on the Approval detail Page
Data constraints and Search

2. Multi-line input

Use this control to enter complex Text — for example, detailed notes, interview transcripts, or interview evaluations. Line breaks are supported. Settings interface Add a multi-line input in the form designer:
Adding a multi-line input in the form designer
Multi-line input Attribute Settings panel:
Multi-line input Attribute Settings panel
Multi-line input as it appears on a mobile form:
How the multi-line input appears on a mobile form
Attribute Settings The multi-line input supports line breaks and recognizes Links and Markdown-formatted Content:
The multi-line input supports line breaks and recognizes Links and Markdown-formatted Content
Entered Content as it appears on the Approval detail Page:
How the entered Content appears on the Approval detail Page
Data constraints and Search

3. Numeric input

Use this control to enter Numbers, such as purchase quantity, stock quantity, or points. Settings interface Add a numeric input in the form designer:
Adding a numeric input in the form designer
Numeric input Attribute Settings panel:
Numeric input Attribute Settings panel
Numeric input as it appears on a mobile form:
How the numeric input appears on a mobile form
Attribute Settings Data constraints and Search

4. Single Select

Use this control to pick one option from a preset list of Enum values, such as a reimbursement category or goods category. These Enum values can be edited directly on the form, or sourced by referencing Data from another Data Source as options. Settings interface Add a single Select in the form designer:
Adding a single Select in the form designer
Single Select Attribute Settings panel — option Content can be edited:
Single Select Attribute Settings panel
Selecting an option on a mobile form:
How selecting an option on a mobile form looks
When “Inline options” is On, the options are displayed inline on the form: Turn on Inline options in the attribute panel:
Turning on Inline options in the attribute panel
Inline options as they appear on a mobile form:
How Inline options appear on a mobile form
Attribute Settings Data constraints and Search

5. Multiselect

Use this control to pick several options from a preset list of Enum values, such as issue-cause Tags. These Enum values can be edited directly on the form, or sourced by referencing Data from another Data Source as options. Settings interface Add a Multiselect in the form designer:
Adding a Multiselect in the form designer
Multiselect Attribute Settings panel — option Content can be edited:
Multiselect Attribute Settings panel
Selecting options on a mobile form:
How selecting options on a mobile form looks
When “Inline options” is On, the options are displayed inline on the form: Turn on Inline options in the attribute panel:
Turning on Inline options in the attribute panel
Inline options as they appear on a mobile form:
How Inline options appear on a mobile form
Attribute Settings Data constraints and Search

6. Date

Use this control to set a specific Date, such as the expected arrival Date of purchased items. Settings interface Add a Date control in the form designer:
Adding a Date control in the form designer
Date control Attribute Settings panel:
Date control Attribute Settings panel
Picking a Date on the mobile side:
How Date picking looks on the mobile side
Picking a Date via the Date picker on desktop:
Picking a Date via the Date picker on desktop
Picked Date as it appears on a mobile form:
How the picked Date appears on a mobile form
Attribute Settings Data constraints and Search

7. Date range

Use this control to set a specific time span, such as the contract start time and end time. Settings interface Add a Date range control in the form designer:
Adding a Date range control in the form designer
Date range Attribute Settings panel:
Date range Attribute Settings panel
Date range as it appears on a mobile form:
How the Date range appears on a mobile form
When “Auto-calculate duration” is On, the form automatically displays the difference between the start time and end time: Turn on Auto-calculate duration in the attribute panel:
Turning on Auto-calculate duration in the attribute panel
Auto-calculate duration as it appears on a mobile form:
How Auto-calculate duration appears on a mobile form
Attribute Settings Data constraints and Search

8. Description text

This control is often used to describe the purpose of the current form. Add Links, red-highlighted Text, and similar elements to strengthen reminders. It is typically used to display rules and regulations, or items the Respondent must confirm — such as a Link to a letter of commitment. Settings interface Add a Description text control in the form designer:
Adding a Description text control in the form designer
Description text Attribute Settings panel — Text Content, color, and Redirect To Link can be configured:
Description text Attribute Settings panel
Description text as it appears on a mobile form:
How Description text appears on a mobile form
Attribute Settings Data constraints and Search

9. ID card

Use this control in scenarios that require the ID card Number to be entered accurately. If the ID card information is invalid, an Error message appears on Submit. Settings interface Add an ID card control in the form designer:
Adding an ID card control in the form designer
ID card control Attribute Settings panel:
ID card control Attribute Settings panel
Validation Tips on mobile when the ID card Number format is invalid:
Validation Tips on mobile when the ID card Number format is wrong
Attribute Settings With Hide sensitive info On, the ID card Number is masked on the Approval form:
With Hide sensitive info On, the ID card Number is masked
Data constraints and Search

10. Phone

Supports format validation for mobile Numbers and landlines from common countries. When a Phone number is required, the entry can be pre-checked on Submit. Settings interface Add a Phone control in the form designer:
Adding a Phone control in the form designer
Phone control Attribute Settings panel — the Phone Type can be selected:
Phone control Attribute Settings panel
Validation Tips on mobile when the Phone number format is invalid:
Validation Tips on mobile when the Phone number format is wrong
Attribute Settings Data constraints and Search

3) Enhanced controls

1. Cascade/Category

Use this control in scenarios where categories must be maintained in Tiers, such as recording item information for inventory management, or Province/City/District. Settings interface Add a Cascade/Category control in the form designer:
Adding a Cascade/Category control in the form designer
Edit the category Data — a multi-Tier category Table of contents is supported:
Editing the category Data
Cascade/Category Attribute Settings panel — the Data source can be selected:
Cascade/Category Attribute Settings panel
Tier-by-Tier picking of Cascade/Category on mobile:
How Cascade/Category Tier-by-Tier picking looks on mobile
Attribute Settings Data constraints and Search

2. Image

Use this control to capture Image information in form-Data scenarios — for example, in customer-visit records, use the Image control to log on-site notes from a visit. Settings interface Add an Image control in the form designer:
Adding an Image control in the form designer
Image control Attribute Settings panel — Upload count limit and watermark photos can be configured:
Image control Attribute Settings panel
Uploading images on mobile:
Uploading images on mobile
With Watermark photos On, images must be uploaded via Take photo and carry watermark info:
With Watermark photos On, images must be uploaded via Take photo and carry watermark info
Attribute Settings Data constraints and Search

3. Details/Spreadsheet

Details/Spreadsheet is a control that organizes Data and information as Records and Columns. It is primarily used for collecting repeated Data that shares the same header — for example, inventory-inbound details or reimbursement details.
  • The control itself carries no Data. Think of it as a block into which Data can be repeatedly added, or as an empty Table
  • The Data items you fill in (that is, the header of the Spreadsheet) are defined by placing the required controls (such as single-line inputs, single Select, and so on) into the detail control
For step-by-step instructions, see detail control. Settings interface Add a Details/Spreadsheet control in the form designer:
Adding a Details/Spreadsheet control in the form designer
Drag other controls into the Details table to compose the header:
Dragging other controls into the Details table to compose the header
Details/Spreadsheet Attribute Settings panel:
Details/Spreadsheet Attribute Settings panel
Filling in Details Data on mobile:
Filling in Details Data on mobile
Details table as it appears on a mobile Approval form:
How the Details table appears on a mobile Approval form
Attribute Settings Configuration steps for Data linkage: Turn on Data linkage in the Details attribute panel:
Turning on Data linkage in the Details attribute panel
Select the linked Target form and Details Field:
Selecting the linked Target form and Details Field
Set linkage conditions and fill rules:
Setting linkage conditions and fill rules
Select which header fields to display to filter the displayed Columns:
Selecting which header fields to display
Data constraints and Search

4. Amount

Use this control in scenarios that require Chinese uppercase Amount, or that need Linked payment. Settings interface Add an Amount control in the form designer:
Adding an Amount control in the form designer
Amount control Attribute Settings panel:
Amount control Attribute Settings panel
Amount control as it appears on a mobile form:
How the Amount control appears on a mobile form
Attribute Settings With Show uppercase On, the Amount is automatically converted to Chinese uppercase:
The Amount is automatically converted to Chinese uppercase
Data constraints and Search

5. Attachment

Use this control to Upload File information. It supports previewing common Text formats such as docx, doc, and pdf, as well as Video-format files. For example, in a contract scenario, use the Attachment control to Upload the contract file; in a procurement scenario, use it to Upload an Excel file. Settings interface Add an Attachment control in the form designer:
Adding an Attachment control in the form designer
Attachment control Attribute Settings panel:
Attachment control Attribute Settings panel
Add Attachment flow on mobile:
How the Add Attachment flow looks on mobile
Attribute Settings Data constraints and Search

6. Signature

This control adds a Signature to the form. On Submit or on change, adding a Signature creates a confirmation step to ensure formality — for scenarios such as letters of commitment. Settings interface Add a Signature control in the form designer:
Adding a Signature control in the form designer
Signature Attribute Settings panel — the signing mode can be selected:
Signature Attribute Settings panel
Signing on mobile:
How signing looks on mobile
Attribute Settings Data constraints and Search

7. Contact

Use this control to select a User from the Contacts. Use the Contact control when the owner of a specific item needs to be shown; a Contact on a form can also be set as an approver — for step-by-step instructions, see How to set a form-internal Contact as the approver. Settings interface Add a Contact control in the form designer:
Adding a Contact control in the form designer
Contact control Attribute Settings panel:
Contact control Attribute Settings panel
Picking a Contact from the Contacts on mobile:
Picking a Contact from the Contacts on mobile
Contact as it appears on a mobile form:
How the Contact appears on a mobile form
Attribute Settings Data constraints and Search

8. Department

Supports selecting an already-created Department from the Contacts. Use the Department control when the owning Department for a specific item needs to be shown. The manager or Role corresponding to a Department on a form can be set as an approver — commonly used in role-transfer and handover scenarios. Settings interface Add a Department control in the form designer:
Adding a Department control in the form designer
Department control Attribute Settings panel:
Department control Attribute Settings panel
Picking a Department from the Contacts on mobile:
Picking a Department from the Contacts on mobile
Attribute Settings Data constraints and Search

9. Current location

Supports capturing the User’s current Location. In scenarios such as customer visits, Location info must be captured in real time, and the User can also fine-tune the Location manually. Settings interface Add a Current location control in the form designer:
Adding a Current location control in the form designer
Current location Attribute Settings panel:
Current location Attribute Settings panel
Capturing the current Location on mobile, with fine-tuning supported:
Capturing the current Location on mobile with fine-tuning supported
Attribute Settings Data constraints and Search Desktop Tips prompt the user to scan with mobile DingTalk to capture the current Location:
Desktop Tips prompt to scan with mobile DingTalk to capture the current Location
Error Tips when fine-tuning exceeds the Allowed range:
Error Tips when fine-tuning exceeds the Allowed range

10. Calculate Formula

Supports simple arithmetic such as addition, subtraction, multiplication, and division. Use this control in scenarios that need automatic numeric Calculation — such as orders and finance — for example, computing the total price from a unit price and a quantity. Settings interface Add a Calculate Formula control in the form designer:
Adding a Calculate Formula control in the form designer
Edit the Calculate Formula — the four arithmetic operations can be applied to Amount and Numerical controls on the form:
Editing the Calculate Formula
The Calculation result is displayed automatically on a mobile form:
The Calculation result is displayed automatically on a mobile form
Attribute Settings Data constraints and Search

11. Associated Approval form

Supports selecting one Record from an Approval form within the Organization — for example, linking a procurement form or a business-trip form from a reimbursement form. Settings interface Add an Associated Approval form control in the form designer:
Adding an Associated Approval form control in the form designer
Associated Approval form Attribute Settings panel — the Type of the associated Approval form can be specified:
Associated Approval form Attribute Settings panel
Selecting the Approval form to associate on mobile:
Selecting the Approval form to associate on mobile
Selecting the Approval form to associate on desktop:
Selecting the Approval form to associate on desktop
Associated Approval form as it appears on a mobile form:
How the associated Approval form appears on a mobile form
Attribute Settings Data constraints and Search

12. Province/City/District

Supports the User selecting address information — Province/City/District, street, and a free-form detailed address. It is typically used in scenarios where the User must provide address information, helping the User fill in the address quickly and accurately, and avoiding errors or omissions. Settings interface Add a Province/City/District control in the form designer:
Adding a Province/City/District control in the form designer
Province/City/District Attribute Settings panel — the address format can be selected:
Province/City/District Attribute Settings panel
Picking Province/City/District Tier-by-Tier and filling in the detailed address on mobile:
Picking Province/City/District Tier-by-Tier and filling in the detailed address on mobile
Attribute Settings With Hide sensitive info On, the detailed address is masked on the Approval detail Page:
With Hide sensitive info On, the detailed address is masked on the Approval detail Page
Data constraints and Search

13. Rating

Pick a number of stars as the Rating. Both 5-star and 10-star scales are supported — for example, satisfaction surveys, experience Feedback, and other scenarios where the User must provide a Rating. Settings interface Add a Rating control in the form designer:
Adding a Rating control in the form designer
Rating control Attribute Settings panel — 5-star or 10-star scale can be selected:
Rating control Attribute Settings panel
Tapping stars to rate on mobile:
Tapping stars to rate on mobile
Attribute Settings Selecting 4 stars shows 4 points on the Approval detail Page:
Selecting 4 stars shows 4 points on the Approval detail Page
Data constraints and Search

Option linkage

Set up linked display between single Select options and other controls

Detail control

Use the Details/Spreadsheet control to collect multiple Records with the same fields

Process design

Design Approval process Steps and conditional branches

AI controls

Use AI controls to improve form-filling and Approval efficiency