Remove PDF form fields

A form field can be removed by deleting its widget annotations. This will remove the ability to interact with the form field since widget annotations represent the appearances of form fields in a PDF document.

Its important to note that a form field can be associated to multiple widget annotations which means there can be multiple interactive appearances and locations in a document for a single form field.

Remove all fields

To remove all form fields in a document, you can remove all widget annotations.

JavaScript (SDK v8.0+)

// config.js
const { documentViewer, annotationManager, Annotations } = instance.Core;

documentViewer.addEventListener('annotationsLoaded', () => {
  const annots = annotationManager.getAnnotationsList();

  // find the widget annotations
  const widgetAnnots = annots.filter(a => a instanceof Annotations.WidgetAnnotation)

  // remove the widget annotations
  annotationManager.deleteAnnotations(widgetAnnots);
});

WebViewerInstance DocumentViewer#annotationsLoaded AnnotationManager.getAnnotationsList Annotations.WidgetAnnotation AnnotationManager.deleteAnnotations

JavaScript (SDK v6.0+)

// config.js
const { docViewer, annotManager, Annotations } = instance;

docViewer.on('annotationsLoaded', () => {
  const annots = annotManager.getAnnotationsList();

  // find the widget annotations
  const widgetAnnots = annots.filter(a => a instanceof Annotations.WidgetAnnotation)

  // remove the widget annotations
  annotManager.deleteAnnotations(widgetAnnots);
});

WebViewerInstance DocumentViewer#annotationsLoaded AnnotationManager.getAnnotationsList Annotations.WidgetAnnotation AnnotationManager.deleteAnnotations

Remove fields by name

To remove a single field, you can find a field by its name and then delete its widget annotations.

JavaScript (SDK v8.0+)

// config.js
const { documentViewer, annotationManager } = instance.Core;

documentViewer.addEventListener('annotationsLoaded', () => {
  const fieldManager = annotationManager.getFieldManager();
  const field = fieldManager.getField('fieldName');
  annotationManager.deleteAnnotations(field.widgets);
});

DocumentViewer.getAnnotationsLoadedPromise DocumentViewer#documentLoaded AnnotationManager.getFieldManager FieldManager.getField Annotations.WidgetFlags AnnotationManager.deleteAnnotations

JavaScript (SDK v6.0+)

// config.js
const { docViewer, annotManager } = instance;

docViewer.on('annotationsLoaded', () => {
  const fieldManager = annotManager.getFieldManager();
  const field = fieldManager.getField('fieldName');
  annotManager.deleteAnnotations(field.widgets);
});

DocumentViewer.getAnnotationsLoadedPromise DocumentViewer#documentLoaded AnnotationManager.getFieldManager FieldManager.getField Annotations.WidgetFlags AnnotationManager.deleteAnnotations