Foxit PDF SDK For Web - V11.0.1

# Form Data Processing

Form data processing is an essential feature of the SDK, encompassing functionalities such as exporting data from PDF forms, filling data into forms, and exporting data to other formats. This chapter will introduce how to use these features.

# Export Data

Foxit PDF SDK for Web allows you to export data from PDF forms into specific file formats. The supported formats include:

  • xfdf (XML Forms Data Format)
  • fdf (Forms Data Format)
  • csv (Comma-Separated Values)
  • json (JavaScript Object Notation)
  • text (Plain Text)
  • xml (eXtensible Markup Language)

Below is an example of how to use the exportToFile (opens new window) method:

const doc = pdfViewer.getCurrentPDFDoc();
const form = doc.getPDFForm();
const blob = await form.exportToFile(PDFViewCtrl.commons.FileFormat.json, {});

In this example, PDFViewCtrl.commons.FileFormat is a constant enumeration used to specify the file format to export. The second parameter is left undefined, meaning that all form data will be exported.

If you want to export specific form fields, you can set the fieldNames and isExcludeFields properties as shown below:

const doc = pdfViewer.getCurrentPDFDoc();
const form = doc.getPDFForm();
const blob = await form.exportToFile(PDFViewCtrl.commons.FileFormat.json, {
    fieldNames: ['Text Field0', 'Check Box0'],
    isExcludeFields: true
});

In this example, we set isExcludeFields to true, which excludes the fields Text Field0 and Check Box0, while all other fields will be exported. If you only want to export Text Field0 and Check Box0, you can either omit the isExcludeFields property or set it to false:

const doc = pdfViewer.getCurrentPDFDoc();
const form = doc.getPDFForm();
const blob = await form.exportToFile(PDFViewCtrl.commons.FileFormat.json, {
    fieldNames: ['Text Field0', 'Check Box0']
});

# Import Data

Foxit PDF SDK for Web supports importing data from specific file formats into PDF forms. Below is an example of how to use the importFromFile (opens new window) method:

const doc = pdfViewer.getCurrentPDFDoc();
const form = doc.getPDFForm();

const response = await fetch('formData.xfdf');
const xfdfData = await response.blob();
await form.importFromFile(xfdfData, PDFViewCtrl.commons.FileFormat.xfdf);

The example above demonstrates how to load data from an XFDF file and import it into the currently opened PDF form.

If the imported data is in csv or text format，you need to confirm the delimiter used in the file. You can specify the delimiter by setting the delimiter parameter. By default, csv files use a delimiter of ,, while text files use a delimiter of \n.

const doc = pdfViewer.getCurrentPDFDoc();
const form = doc.getPDFForm();

const response = await fetch('formData.csv');
const csvData = await response.blob();
await form.importFromFile(csvData, PDFViewCtrl.commons.FileFormat.csv, {
    delimiter: ','
});

const doc = pdfViewer.getCurrentPDFDoc();
const form = doc.getPDFForm();

const response = await fetch('formData.txt');
const textData = await response.blob();
await form.importFromFile(textData, PDFViewCtrl.commons.FileFormat.text, {
    delimiter: '\n'
});

# Reset Form

Foxit PDF SDK for Web provides the PDFForm.resetForm (opens new window) interface, which is used to reset form field values to their default values.

The definition of the PDFForm.resetForm (opens new window) method:

async resetForm(fieldNames: string[], isExclude: boolean = false): Promise<void>;

Parameter description：

  1. fieldNames: Specifies the names of the form fields to be reset. If left empty, all form fields will be reset.

  2. isExclude: Indicates whether the fields listed in fieldNames should be excluded from the reset. The default value is true, meaning the fields in the fieldNames list will not be reset. If set to false, the fields in the fieldNames list will be reset.

If you want to reset specific form fields, you can set the fieldNames parameter to the names of the fields you want to reset and set the isExclude parameter to false. Below is an example of usage:

const doc = pdfViewer.getCurrentPDFDoc();
const form = doc.getPDFForm();
await form.resetForm(
    ['Text Field0', 'Combo Box0'],
    false
)

If you want to reset all form fields, you can set fieldNames to an empty array [] and set isExclude to true. Here's an example:

const doc = pdfViewer.getCurrentPDFDoc();
const form = doc.getPDFForm();
await form.resetForm(
    [],
    true
)

← Form Interaction Modes →