Some test text!

Search
Hamburger Icon

Web / Guides / Fill form fields

Filling PDF form fields using JavaScript

Make sure you have Full API enabled in WebViewer.

To fill and set values for existing form fields.

async function main() {
  const doc = await PDFNet.PDFDoc.createFromURL(filename);

  // Search for a specific field
  const field = await doc.getField("employee.name.first");
  await field.setValueAsString("John");
}
PDFNet.runWithCleanup(main);

PDF Interactive Forms (AcroForms)
Full code sample which illustrates some basic PDFNet capabilities related to interactive forms (also known as AcroForms).

About filling form fields

Form Fields can be populated using the Field.SetValue() method:

field.setValueAsString("New Value");

// Regenerate appearance stream.
field.refreshAppearance();

Note that, after modifying the Field's value, we refreshed its appearance stream. In the PDF format, Field's value and appearance are two different entities. Therefore, if you don't call RefreshAppearance(), the initial value on a PDF page will remain unchanged — it may have retain the old value or it may be blank.

One approach used by other PDF libraries is to let the PDF viewer automatically pre-generate appearance streams by setting the 'NeedAppearances' flag in AcroForm dictionary:

doc.getAcroForm().putBool("NeedAppearances", true);

This will force viewer applications to auto-generate appearance streams every time the document is opened. This method is unreliable — Acrobat does not always generate appearance streams correctly. Another disadvantage of this approach is that the user will always be prompted to save the document even if the document was never modified.

Field.GetValueAsString() returns the field's value as a string. The value returned varies based on the field type. A text field type varies depending on the field type. A text field will return a string:

if (type === PDFNet.Field.Type.e_text && field.getValue()) {
  console.log("Field value: %s", field.getValueAsString());
} else {
  console.log("Field is blank");
}

Other field types, such as check boxes and radio buttons, can also return text from GetValueAsString(). Similarly, the Field.GetValueAsString() method is available.

Access interactive fields

The form shown in the following figure consists of a number of Fields:

Every field has its name and value, as well as its annotation appearance.

In the Apryse SDK, Fields are accessed through FieldIterators.

For example, the list of all Fields present in the document can be traversed using the following code snippet:

const itr = await doc.getFieldIteratorBegin();
for (; await itr.hasNext(); itr.next()) {
  const field = await itr.current();
  println("Field name: %s", field.GetName());
}

Trial setup questions? Ask experts on Discord
Need other help? Contact Support
Pricing or product questions? Contact Sales