Add label for CheckBox field

Technical Support
1

Hi,

How i can add label for Checkbox Field, i can create CheckboxField, but i dont
know how to add label, and i dont see any document about it.

Thank you.

Code snippet
const field = new Annotations.Forms.Field(“abcdef”, {
type: ‘Btn’,
value: ‘Off’,
flags,
font: font,
});

const widgetAnnot = new Annotations.CheckButtonWidgetAnnotation(field, {
  appearance: 'Off',
  appearances: {
    Off: {},
    Yes: {},
  },
  captions: {
    Normal: "" // Check
  }
});

// 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]);
3

Hi dangpt,

Thank you for contacting pdf.js express forums,

Here is the API docs for the form-field:
https://pdfjs.express/api/Core.Annotations.Forms.Field.html

We have the tooltipName that you can use for when hovering over the checkbox.

Let me know how that works for you.

Best regards,
Kevin Kim


Share how you are using PDF.js Express in your organization you could win a $500 Amazon gift card. All participants will receive 6 months of PDF.js Express+ for free. Learn more here

4

2022-11-21_12-29-46
2022-11-21_12-29-461530×802 52.9 KB

Hi kkim,

I want add label like this, not tooltip name.

With checkbox right and label left.

Thank you.

5

Hi dangpt,

Thank you for your response,

You have the position of the checkbox widget at (100, 100) from

    widgetAnnot.X = 100;
    widgetAnnot.Y = 100;

You can create a free-text annotation to the left of the widget following this guide:

Best regards,
Kevin Kim


Share how you are using PDF.js Express in your organization you could win a $500 Amazon gift card. All participants will receive 6 months of PDF.js Express+ for free. Learn more here