Create Checkbox Fields

1WebViewer(...)
2.then(instance => {
3  const { annotationManager, Annotations, documentViewer } = instance.Core;
4  const { WidgetFlags } = Annotations;
5
6  documentViewer.addEventListener('documentLoaded', () => {
7    // Sets flags for the checkbox widget.
8    const flags = new WidgetFlags();
9    flags.set(WidgetFlags.REQUIRED, true);
10
11    // Creates a checkbox form field.
12    const field = new Annotations.Forms.Field('CheckboxField 1', {
13      type: 'Btn',
14      value: 'Off',
15      flags,
16    });
17
18    // Creates a checkbox widget annotation.
19    const widgetAnnot = new Annotations.CheckButtonWidgetAnnotation(field, {
20      appearance: 'Off',
21      appearances: {
22        Off: {},
23        Yes: {},
24      },
25      captions: {
26        Normal: '' // Uses the check symbol for selected caption.
27      }
28    });
29
30    widgetAnnot.PageNumber = 1;
31    widgetAnnot.X = 100;
32    widgetAnnot.Y = 100;
33    widgetAnnot.Width = 25;
34    widgetAnnot.Height = 25;
35
36    // Add form field to field manager and widget annotation to annotation manager.
37    annotationManager.getFieldManager().addField(field);
38    annotationManager.addAnnotation(widgetAnnot);
39    annotationManager.drawAnnotationsFromList([widgetAnnot]);
40  });
41});