How do we programmatically save changes to a tab which is not the current one?

WebViewer v12.0.1

Situation:

  • Multiple documents are loaded.
  • Some have been modified in the viewer.
  • The current tab shows an unmodified document.
  • The user clicks our ‘save’ button, which needs to send all of the modified PDFs to the server.

All of our documents were loaded using something like this:

const document = await control.Core.createDocument(documentResource.url, { docId: documentResource.id });
const tabId = await control.UI.TabManager.addTab(document);

At save time we then do something like:

const tab = tabs.find(tab => tab.src?.getDocumentId() == documentResource.id);
// This fails:
const data = await tab.src.getFileData();

This fails for all tabs except the currently active tab: Unable to access Document id=null.

What’s the correct way to get the modified PDF data for non-active tabs?

Thanks!

1 Like

Hi,

Thank you for reaching out. I apologise for the delay.

You could save the tab before switching to another, removing the issue of having to save inactive tabs:

UI.addEventListener(UI.Events.BEFORE_TAB_CHANGED, e => {
  // Handle logic for saving before switching tabs
});

You could also switch through every tab to save them when using that button:

const tabs = UI.TabManager.getAllTabs();

for (const tab of tabs) {
  await UI.TabManager.setActiveTab(tab.id);

  await Core.documentLoadedPromise;

  const fileData = await Core.documentViewer.getDocument().getFileData();
   console.log('fileData', fileData); // save to backend
}

Let us know if that works for you.

Best Regards,
Mickaël.

1 Like