Want to get click event on Stamp button

Product: Web viewer

Product Version:11.4.0

Please give a brief summary of your issue: I want to get click event of the stamp button.

Please describe your issue and provide steps to reproduce it:

1 Like

Hello, I’m AiRon, an automated tech support bot :robot:
While you wait for one of our customer support representatives, I can help you with your question.


To capture the click event on the Stamp button in WebViewer, you can customize the toolbar to listen for this event. The toolbar buttons in WebViewer are customizable, and you can attach event listeners to them.

Some things you can try:

  • Use the setHeaderItems API to customize the toolbar and access the Stamp button.

  • Attach an event listener to the Stamp button using JavaScript to detect when it is clicked.

  • Ensure that your code is executed after the WebViewer has been fully initialized.



Here are some resources that might help you:

  • Customizing the Toolbar - Learn how to use the setHeaderItems method to customize the toolbar and add event listeners.

  • UI Customization Guide - Get a deeper understanding of how to customize the UI elements in WebViewer.

  • Stamp Annotations - Understand more about how stamp annotations work within WebViewer.

  • Event Listeners - Learn how to work with events in WebViewer, including attaching custom event handlers.



Hopefully, this helps you solve your problem while you wait for a human to get back to you.

1 Like

Hello Rishu,

Thank you for contacting WebViewer Forums.

In order to add a click event to the above button, you can grab the element with querySelector for example and add the addEventListener(‘click’) to it. Please let me know if this works for you. Thank you.

Regards,
Luke

1 Like

I try to get the button using query selector but getting undefined.
This is what I have tried
document.querySelector(‘[data-element=‘stampToolButton’]’);

Please let me know if I m doing anything wrong.

1 Like

Hello Rishu,

Thank you for your reply.

You may need to find the element within the shadow DOM if you are using WebComponent. Please see if the following works for you:

document.querySelector("#wc-viewer").shadowRoot.querySelector('[data-element="stampToolButton"]')

Regards,
Luke

1 Like