# Listen for the print event

**URL:** <https://pdfjs.community/t/listen-for-the-print-event/1492>\
**Category:** Technical Support\
**Created:** [March 22, 2022, 9:35pm UTC](https://pdfjs.community/t/listen-for-the-print-event/1492 "2022-03-22T21:35:03Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![andy](https://avatars.discourse-cdn.com/v4/letter/a/aeb1de/32.png) [@andy](https://pdfjs.community/u/andy)\
**Post date:** [March 22, 2022, 9:35pm UTC](https://pdfjs.community/t/listen-for-the-print-event/1492/1 "2022-03-22T21:35:03Z")

</div>

**Which product are you using?**  
PDF.js Express Plus

**PDF.js Express Version**  
8.1.1

**Detailed description of issue**  
Wanting to know if there is a way to attach an event listener onto the print method.

**Expected behaviour**  
When a user clicks the print button I would like to be notified.

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex031/uploads/pdfjscommunity/original/1X/ffbcd25c7d423db8d5acd5db201c272f4db306dd.png) [@system](https://pdfjs.community/u/system)\
**Post date:** [March 22, 2022, 9:35pm UTC](https://pdfjs.community/t/listen-for-the-print-event/1492/3 "2022-03-22T21:35:08Z")

</div>

**Hello, I’m Ron, an automated tech support bot 🤖**

While you wait for one of our customer support representatives to get back to you, please check out some of these documentation pages:

Guides:
- [Add annotation events](https://pdfjs.express/documentation/annotation/annotation-events.8)
- [Customize annotation tools - Event when tool creates an annotation](https://pdfjs.express/documentation/annotation/customizing-tools.8#event-when-tool-creates-an-annotation)
- [Config files - Useful events](https://pdfjs.express/documentation/learn-more/advanced/config-files.8#useful-events)

APIs:
- [UI - removeEventListener(eventName, listener)](https://pdfjs.express/api/UI.html#.removeEventListener__anchor)
- [Core.Annotations.Forms.FieldManager - print()](https://pdfjs.express/api/Core.Annotations.Forms.FieldManager.html#print__anchor)
- [Core.AnnotationManager - getAnnotationByMouseEvent(event)](https://pdfjs.express/api/Core.AnnotationManager.html#getAnnotationByMouseEvent__anchor)

Forums:
- [How to download Pdf with annotations](https://pdfjs.community/t/how-to-download-pdf-with-annotations/276/1)
- [Customize print options](https://pdfjs.community/t/customize-print-options/490/2)
- [Requiring Signature Text to be changed](https://pdfjs.community/t/requiring-signature-text-to-be-changed/1431/1)

---

<div class="post-metadata">

**Author:** ![dnavarro](https://yyz1.discourse-cdn.com/flex031/user_avatar/pdfjs.community/dnavarro/32/707_2.png) [@dnavarro](https://pdfjs.community/u/dnavarro)\
**Post date:** [March 23, 2022, 3:42pm UTC](https://pdfjs.community/t/listen-for-the-print-event/1492/4 "2022-03-23T15:42:14Z")

</div>

Hi Andy,

Thanks for your question.

One option would be using the UI event **VISIBILITY\_CHANGED**. [(Click here for this event documentation)](https://pdfjs.express/api/UI.html#event:visibilityChanged__anchor)

Here is a code snippet to help you

```javascript
import WebViewer from '@pdftron/pdfjs-express-viewer'

WebViewer({
...options
}).then(instance => {

  const UIEvents = instance.UI.Events;

  instance.UI.addEventListener(UIEvents.VISIBILITY_CHANGED, e => {
    const { element, isVisible } = e.detail;
    if(element === 'printModal' && isVisible) {
      console.log('The user clicked the print button and the print modal is now open');
    }
  });

})

```

Let me know if this works for you.

Thank you,  
Dandara

---

<div class="post-metadata">

**Author:** ![andy](https://avatars.discourse-cdn.com/v4/letter/a/aeb1de/32.png) [@andy](https://pdfjs.community/u/andy)\
**Post date:** [March 23, 2022, 4:47pm UTC](https://pdfjs.community/t/listen-for-the-print-event/1492/5 "2022-03-23T16:47:01Z")

</div>

Thanks Dandara, this will be helpful and I’ll give it a try.

Know of any way to track the print button after they’ve opened this modal?

---

<div class="post-metadata">

**Author:** ![dnavarro](https://yyz1.discourse-cdn.com/flex031/user_avatar/pdfjs.community/dnavarro/32/707_2.png) [@dnavarro](https://pdfjs.community/u/dnavarro)\
**Post date:** [March 23, 2022, 5:41pm UTC](https://pdfjs.community/t/listen-for-the-print-event/1492/6 "2022-03-23T17:41:00Z")

</div>

Hi Andy, my pleasure.

You can add the following code to track the print button after the modal is open.

```javascript
import WebViewer from '@pdftron/pdfjs-express-viewer'

WebViewer({
...options
}).then(instance => {
    ...

    const iframeDoc = instance.UI.iframeWindow.document;
    const modalPrintButton = iframeDoc.querySelector('.PrintModal .button');
    
    modalPrintButton.addEventListener('click', () => {
      console.log('Print button was clicked');
    });

})

```

Do you mean the print button inside the modal, correct?  
Please let me know if this works for you.

Thanks,  
Dandara

---

<div class="post-metadata">

**Author:** ![andy](https://avatars.discourse-cdn.com/v4/letter/a/aeb1de/32.png) [@andy](https://pdfjs.community/u/andy)\
**Post date:** [March 23, 2022, 6:03pm UTC](https://pdfjs.community/t/listen-for-the-print-event/1492/7 "2022-03-23T18:03:16Z")

</div>

This worked Dandara, thanks for showing me how to access the iframe document.

👍 👍