Load documents dynamically in JavaScript PDF Viewer

16 Oct 20251 minute to read

Load or switch PDF documents dynamically after the initial load. Use the load method to load a PDF by Base64 string or file name.

The following steps show how to load a PDF dynamically.

Step 1: Follow the steps in the Get started with JavaScript ES5 PDF Viewer guide to create a sample.

Step 2: Use the following code to load a PDF using a Base64 string.

<button id='load1'>LoadDocumentFromBase64</button>

// Load PDF document from Base64 string
document.getElementById('load1').addEventListener('click', () => {
  viewer.load(
    'data:application/pdf;base64,'+ AddBase64String, null);
}

Step 3: Use the following code to load a PDF by document name.

<button id='load2'>LoadDocument</button>

// Load PDF document using file name
document.getElementById('load2').addEventListener('click', () => {
  viewer.load('https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf', null);
});

Find the sample: Load PDF documents dynamically