Support Request: Displaying Signature Prompt Near Signature Field in Apryse PDF Application

Technical Support WebViewer
1

Hello,

I have developed a PDF signing application using Apryse, where users are required to sign documents. I have successfully implemented the functionality to add signature fields, and the application prompts users to provide their signature when required.

However, I’ve encountered an issue:
When the signature field is positioned at the bottom of the PDF document, users must scroll back to the top of the document to select their signature before signing. This creates a less-than-ideal user experience.

Expected Behavior:
Is there a way to display the signature selection prompt near the corresponding signature field? This way, the user doesn’t have to scroll to the top of the document regardless of where the signature field is located.

Your guidance on how to achieve this functionality would be greatly appreciated.

Environment Details:

  • Development Framework: ReactJS
  • Apryse Version: @pdftron/webviewer (10.4.0)

Thank you for your assistance!

Best regards,
Ajay Kumar

1 Like
2

Hi there,

We do not have an API to move the ToolsOverlay to the position near the bottom.

If you are using 10.4, you could follow our advanced UI customization to fork our UI and change the position of the ToolsOverlay:

You could alternatively upgrade your WebViewer to the later versions and use our Modular-UI, which allows you to move around the ToolsOverlay:

best regards,
Kevin

1 Like
3

Thanks you for your response!

In this case I need the coordinates of signature fields, To detect the coordinates of signature fields, I attempted using the following annotationManager event listeners:

annotationManager.addEventListener('annotationChanged', (annotations, action) => {
  // Code here
});

annotationManager.addEventListener('annotationSelected', (annotations, action) => {
  // Code here
});

However, these events do not seem to trigger when interacting with the signature fields. If there’s a way to retrieve the coordinates of the signature fields, it would allow me to position the signature pop-up close to the respective field. Could you please assist with achieving this functionality?

1 Like
4

Hi there,

You could use the mousedown event within the signature widget annotation to get the x,y position.

Here’s an example:

const signatureWidgetAnnotations = annotationManager.getAnnotationsList().filter(annot => annot instanceof Annotations.SignatureWidgetAnnotation)

signatureWidgetAnnotations.forEach(widget => {
        widget.addEventListener('mousedown', () => {
        console.log(widget.X, widget.Y)
    })
})

best regards,
Kevin

1 Like