3

I am working on Reorder Pages in Panel > Thumbnails View. PDFTron provide functionality so i can drag and re-arrange/reorder the pages. Then using that event i will upload the new PDF on server. But i am not able to find the correct event which will trigger only when user perform reorder in thumbnail control.

As of now i am using pageNumberUpdated event but it trigger when user scroll to PDF in PDFVeiwer.

WebViewer({
    licenseKey: 'KEY',
    path: './public/webviewer',
    css: './css/pdftron-custom.css'
}, document.getElementById('pdfEditor') as HTMLElement).then(async(instance: WebViewerInstance) => {
    webViewerInstance = instance;
    
    webViewerInstance.docViewer.on('pageNumberUpdated', async() => {
         // OTHER STUFF
    });
});

PDFTron Link: https://www.pdftron.com/documentation/web/guides/manipulation/thumbnails-controls/#reordering-pages

So basically which event i should use which will trigger when user drag and drop thumbnail to move a page?

DS9
  • 2,995
  • 4
  • 52
  • 102

1 Answers1

3

You can use the layoutChanged event on the DocumentViewer. For example:

//instantiate the viewer as usual 
const { docViewer } = instance;
docViewer.on('layoutChanged', () => console.log('PAGES UPDATED'))

This event gets triggered when changes in the thumbnail panel occur. https://www.pdftron.com/api/web/CoreControls.DocumentViewer.html#event:layoutChanged__anchor

  • That event will help me but on page load i am modifying the page (adding stuff, redraw etc). so that event is triggering on page load. Is there a way to use it with the PageNumberUpdate event? Means combination of two event. – DS9 Oct 07 '20 at 06:57
  • never mind, i have achieved it using some internal logic. But still want to know if some how we can use combination of two event if possible. – DS9 Oct 07 '20 at 08:48