EdgePDF
Features
Tech Specs
Online Demo
How to
Pricing

MVC PDF Viewer Control Component
C#: how to display, view PDF file, customize ASP.NET MVC PDF viewer component UI in asp.net web application


Online Guide for customizing ASP.NET PDF Viewer & Editor using C#, html, javascript








Web viewer width and height settings



It is easy to define Editor width and height with absolute size or relative site.

Editor width and height with absolute size:

<div style="width: 1200px; height: 800px;">
        <iframe name="edgepdf" src=" http://localhost" style="width: 100%; height: 100%"></iframe>
</div>


Editor width and height with relative size:
<div style="width: 90%; height:600px;">
        <iframe name="edgepdf" src="http://localhost" style="width: 100%; height: 90%"></iframe>
</div>



Web viewer startup form view



By default, when editor starts, it will display a form with several tabs to allow users to

  • upload a pdf file
  • upload and convert other files to pdf
  • open an online pdf file
  • combine multiple files to pdf document


Sometimes, you do NOT ALLOW users to upload their own files. You can change editor startup status to "NOFILE".

In {EdgePDF Demo Project}/ RasterEdge_Resource_Files/Javascript/RasterEdge_WebApp.js, Go to function setDialog, change value to "NOFILE".
setDialog(NOFILE);     
// valid values: UPLOAD-PDF, CONVERT-2-PDF, OPEN-ONLINE-PDF, COMBINE-FILES-2-PDF, NOFILE




You can also remove certain tabs in the startup form:
In {EdgePDF Demo Project}/ RasterEdge_Resource_Files/Javascript/RasterEdge_WebApp.js,
setEditorUploadMethod(["CONVERT-2-PDF", "OPEN-ONLINE-PDF", "COMBINE-FILES-2-PDF", "UPLOAD-PDF"]);



Web viewer HTML page title



By default, Web Editor html page title will show current displayed document file name. You can disable this feature.

In {EdgePDF Demo Project}/ RasterEdge_Resource_Files/Javascript/RasterEdge_WebApp.js
Go to function setWebTitle, use the following JS code:

true: it will show current displayed document file name.
false: it will not.

setWebTitle("EdgePDF Editor: online view, comment, redact, edit, convert PDF documents.", true);



Define your own web viewer toolbar and commands



It is really easy to define your own toolbar and commands. Navigate to {EdgePDF Demo Project}/ RasterEdge_Resource_Files/Javascript/RasterEdge_WebApp.js.
All toolbar, command, command groups are defined in this file. You can delete, re-order any of them.