Inserting a page into a PDF using JavaScript

Pages can be inserted into the current PDF document using the insertBlankPages and insertPages functions. Inserting blank pages is fairly straight forward.

// config.js
const docViewer = instance.Core.documentViewer;

docViewer.addEventListener('documentLoaded', async () => {
  const doc = docViewer.getDocument();

  const width = 612;
  const height = 792;
  docViewer.getPageCount(); // 3

  // Insert blank pages
  await doc.insertBlankPages([2, 3], width, height);
  // The document now contains [page1, newBlankPage1, page2, newBlankPage2, page3]
  docViewer.getPageCount(); // 5
});

More likely someone will want to insert pages from one PDF into another. To achieve this, instantiate a new Document object by passing the URL of the second PDF to createDocument function as a first parameter.

// config.js
const { documentViewer } = instance.Core;

documentViewer.addEventListener('documentLoaded', async () => {
  const doc = documentViewer.getDocument();
  const pagesToInsert = [4, 5, 6];
  const pageIndexToInsert = doc.getPageCount() + 1;
  // in this example doc.getPageCount() returns 3


  // use createDocument to create CoreControls.Document instance
  const docToInsert = await instance.Core.CoreControls.createDocument('http://localhost/pdf/another.pdf', {});

  doc.insertPages(docToInsert, pagesToInsert, pageIndexToInsert).then(() => {
    // page 4, 5, and 6 from 'another.pdf' has been inserted into to the current pdf
    doc.getPageCount(); // 6
  });

});