Forms

The WebViewer supports AcroForm fields — text fields, checkboxes, radio buttons, list boxes, combo boxes, and push buttons — plus a form-field creation board and a properties panel. This guide covers the UI-side form APIs.

Form field data models and PDF integration live in the closed-source Core engine (packages/core/src/form/). The UI layer drives them through the core bridge and mirrors form state in the document store.

Form field types

Field	Tool name	Notes
Text field	Textfield	Single/multi-line text input.
Checkbox	Checkbox	Check style configurable.
Radio button	Radiobutton	Grouped.
List box	Listbox	Select one option.
Combo box	Combobox	Dropdown.
Push button	Pushbutton	Action button (text, link, etc.).
Signature	Signature	See Signatures.

UI APIs

UI.setFormBoardFold(fold)

Fold or unfold the form board.

UI.setFormBoardFold(true);   // fold

Toggles formBoardFold in the viewer store, controlling the form-field creation palette visibility.

UI.setFormBoardPosition(position)

Set the form board position.

UI.setFormBoardPosition({ left: 100, top: 200 });  // or a preset string

Sets formBoardPosition { left, top } in the viewer store.

UI.setHighlightForm(value)

Toggle highlighting of form fields.

UI.setHighlightForm(true);

Calls useDocument.setHighlightForm(value), which stores the flag and pushes it into the engine via core.setHighlightForm.

The form board

components/FormBoard/FormBoard.vue is the form-field creation palette, rendered below the header when the form toolbar group is active. It offers the field-creation tools; selecting one activates the corresponding tool via setToolState, which calls core.setTool and core.setInitProperty to seed the new field's default style.

The board state lives in the viewer store: formBoardFold, formBoardPosition, enableFillForm, skipNoRequired, consecutiveType.

The form properties panel (right panel)

The right panel (components/RightPanel/) shows form-field properties across three tabs, switched by UI.setActiveElementTab('rightPanel', tab):

Tab	Contents
General	Field name, button text (push button), visibility, required/indicator flags.
Appearance	Fill color, font color/family/style/size (hidden for signature fields).
Preference	Alignment, default value, multi-line (textfield); button style (checkbox/radio); options (listbox/combobox). Hidden for signature fields.

The panel model is the propertyPanel object in the document store (fieldName, isHidden, title, fillColor, color, fontName/Style/Weight/Size, textAlignment, contents, isMultiLine, checkStyle, isChecked, actionType, text, url, destPage, items[], etc.). Mutations go through core.setPropertyPanel.

Core bridge (form surface)

The core bridge exposes on instance.Core:

Function	Purpose
handleField	Form-field handling.
enableSkipNoRequired / disableSkipNoRequired / isSkipNoRequired	Skip non-required fields.
setConsecutiveType / getConsecutiveType	Consecutive fill type.
disableFillConsecutively / isFillConsecutively	Consecutive fill control.
getFormSignFilledAndUnfilled	Filled/unfilled form+signature counts.
getRequiredFormSign	Required form/signature fields.
setAutoJumpNextSign	Auto-jump to next signature field.

Examples

Highlight form fields

UI.setHighlightForm(true);

Open the form properties panel on Appearance

UI.openElement('rightPanel');
UI.setActiveElementTab('rightPanel', 'Appearance');

Auto-jump to the next signature field

UI.setAutoJumpNextSign(true);   // also pushes to core

Related

• Tools — form-field tools.
• Signatures — signature fields.
• Core Bridge
• API Reference