Skip to content

Forms, printing, and saving

With options={{ forms: true }}, form fields become inputs, check boxes, radio buttons, and lists the reader can fill in; without it, they show as the PDF draws them. What the reader types belongs to the document, and a page keeps its values when it unmounts and mounts again.

What you type stays in this page: the download is made in your browser. Form 1040, Internal Revenue Service (license).

  • viewer.save() resolves to the PDF’s bytes with the values written in, and viewer.download(filename?) hands them to the browser as a download, named after the document’s URL by default.
  • viewer.print({ resolution, onProgress, signal }) draws every page for printing, the typed values included, at 150 dpi by default, and opens the browser’s print dialog with only those pages. A new print request stops the previous job; that job resolves without opening another dialog.
import { usePdfFormChange, usePdfViewer } from "parapdf";
function FormSync({ onChange }: { onChange: (name: string, value: unknown) => void }) {
const viewer = usePdfViewer();
// Each value the reader enters, as they type.
usePdfFormChange(({ name, value }) => onChange(name, value));
const fill = async () => {
const fields = await viewer.getFormFields();
console.log(fields.map(({ name, type, value }) => [name, type, value]));
await viewer.setFormValues({ name: "Ada Lovelace", agree: true, size: "large" });
};
return <button type="button" onClick={fill}>Fill in</button>;
}
  • viewer.getFormFields() resolves to every field (FormField): its qualified name, type ("text", "checkbox", "radio", "combobox", "listbox", "button", or "signature"), current value, defaultValue, readOnly, required, multiple, the options of a list, the exportValues that check its boxes, and its widgets, each a page and a rectangle in PDF points. A value is text, the export value of the checked box or radio button ("Off" for none), or the selected options’ export values, an array for a list that takes several.
  • viewer.setFormValues(values) sets fields by name, true and false checking the first box or none, and resolves to the names it set. The fields shown show the values, and save() and print() include them; it is not heard as the reader’s input.
  • usePdfFormChange(listener), or viewer.onFormChange(listener), which returns the function that stops it, hears { name, value } for each value the reader enters, with forms on.

Form scripts (JavaScript actions: calculations, validation, and button actions) do not run, and XFA forms are not supported.