Viewing

This JavaScript sample lets you display and view a PDF, DOCX, XLSX or PPTX document in our WebViewer (no servers or other external dependencies required). It shows you how to call the WebViewer constructor to instantiate and load a document. You can load local/remote files of your choice. This sample works on all browsers (including IE11) and mobile devices without using plug-ins. Learn more about our Web SDK.

1// eslint-disable-next-line no-undef
2const WebViewerConstructor = isWebComponent() ? WebViewer.WebComponent : WebViewer;
3
4WebViewerConstructor(
5  {
6    path: '../../../lib',
7    initialDoc: 'https://pdftron.s3.amazonaws.com/downloads/pl/demo-annotated.pdf',
8  },
9  document.getElementById('viewer')
10).then(instance => {
11  samplesSetup(instance);
12
13  document.getElementById('select').onchange = e => {
14    instance.UI.loadDocument(e.target.value);
15  };
16
17  document.getElementById('file-picker').onchange = e => {
18    const file = e.target.files[0];
19    if (file) {
20      instance.UI.loadDocument(file);
21    }
22  };
23
24  document.getElementById('url-form').onsubmit = e => {
25    e.preventDefault();
26    instance.UI.loadDocument(document.getElementById('url').value);
27  };
28});

Did you find this helpful?

Trial setup questions?

Ask experts on Discord

Need other help?

Contact Support

Pricing or product questions?

Contact Sales

Product:

Viewing