For the complete documentation index, see llms.txt. This page is also available as Markdown.

Create combo box field and choice widget annotation using JavaScript

To create a new combo box field and a choice widget annotation.

WebViewer(...)
.then(instance => {
  const { annotManager, Annotations } = instance;

  // myBtn is your own custom button
  document.getElementById('myBtn').addEventListener('click', () => {

    // set flags for combo box
    const flags = new Annotations.WidgetFlags();
    flags.set(WidgetFlags.COMBO, true);

    // create combo options
    const options = [
      {
        value: '1',
        displayValue: 'one'
      },
      {
        value: '2',
        displayValue: 'two'
      }
    ];

    // create a form field
    const field = new Annotations.Forms.Field("some combo box field name", {
      type: 'Ch',
      value: options[0].value,
      flags,
      options
    });

    // create a widget annotation
    const widgetAnnot = new Annotations.ChoiceWidgetAnnotation(field);

    // set position and size
    widgetAnnot.PageNumber = 1;
    widgetAnnot.X = 100;
    widgetAnnot.Y = 100;
    widgetAnnot.Width = 50;
    widgetAnnot.Height = 20;

    //add the form field and widget annotation
    annotManager.getFieldManager().addField(field);
    annotManager.addAnnotation(widgetAnnot);
    annotManager.drawAnnotationsFromList([widgetAnnot]);
  });
});

Create fillable PDF forms Full sample code demonstrating how to add form fields to a PDF. Fields are first added as annotations and then converted to interactive form fields. Add signatures, text fields, checkboxes.

Available widget flags are:

  • ReadOnly

  • Required

  • NoExport

  • Multiline

  • Password

  • NoToggleToOff

  • Radio

  • PushButton

  • Combo

  • Edit

  • DoNotScroll

  • RadiosInUnison

Last updated

Was this helpful?