How to create PDF file from Report Viewer and show it in new window using PDF viewer
PDF Viewer
The ASP.NET MVC PDF Viewer control supports viewing, reviewing, and printing PDF files in ASP.NET MVC applications. The hyperlink and table of contents support provides easy navigation within and outside the PDF files. The form-filling support provides a platform to fill, flatten, save, and print PDF files with AcroForm. PDF files can be reviewed with text markup annotation tools.
You can create PDF document from the Report (.rdl file) using Syncfusion Report Viewer and show it in new window using PDF Viewer. Refer to the following code.
HTML
<input type="button" value="Open Report in PDF viewer" onclick="loadPdf();" />
JavaScript
function loadPdf() {
var jsonData = new Object();
jsonData["Id"] = "abc";
var jsonResult = JSON.stringify(jsonData);
$.ajax({
url: '@Url.Action("OpenOrderReport")',
type: 'POST',
dataType: 'json',
crossDomain: true,
traditional: true,
contentType: 'application/json; charset=utf-8',
data: jsonResult,
success: function (data) {
var _filename = data["data"];
var ws = window.open("", '_blank', "width=800,height=600,location=no,menubar=no,status=no,titilebar=no,resizable=no")
//Adding script and CSS files
ws.document.write('<!DOCTYPE html><html><head><title>PdfViewer</title><link href = "https://cdn.syncfusion.com/16.3.0.29/js/web/flat-azure/ej.web.all.min.css" rel = "stylesheet"><script src="https://cdn.syncfusion.com/js/assets/external/jquery-3.1.1.min.js"><\/script><script src="https://cdn.syncfusion.com/16.3.0.29/js/web/ej.web.all.min.js"><\/script><\/head><body>');
//Div to render PDF Viewer
ws.document.write('<div style="width:100%;min-height:570px"><div id="container"><\/div><\/div>')
//Initializes the PDF Viewer
ws.document.write("<script>$(function(){ $('#container').ejPdfViewer({ serviceUrl: '../api/PdfViewer', documentPath: '" + _filename + "', })})<\/script>")
ws.document.write('<\/body><\/html>');
ws.document.close();
},
error: function (msg, textStatus, errorThrown) {
alert('Exception' + msg.responseText);
}
});
}
C#
public object OpenOrderReport(ReportId jsonResult)
{
var id = jsonResult.Id;
ReportWriter reportWriter = new ReportWriter();
reportWriter.ReportPath = Server.MapPath("~/Data/GroupingAgg.rdl");
reportWriter.ReportProcessingMode = ProcessingMode.Remote;
List<ReportParameter> parameters = new List<ReportParameter>();
parameters.Add(new ReportParameter() { Name = "OrderId", Labels = new List<string>() { id }, Values = new List<string>() { id } });
reportWriter.SetParameters(parameters);
var format = WriterFormat.PDF;
MemoryStream ms = new MemoryStream();
//To save the report as memory stream
reportWriter.Save(ms, format);
//Converts memory stream into base64 string
string base64 = "data:application/pdf;base64," + Convert.ToBase64String(ms.ToArray());
var json = new { data = base64 };
return Json(json);
}
Sample
https://www.syncfusion.com/downloads/support/directtrac/general/ze/PdfViewerandReportViewer469303806
Clicking the ‘Open Report in PDF viewer’ in the previously given sample will send the OrderId as parameter to the controller, where the PDF document is created from the report file(.rdl) and sent back the PDF document stream as base64 string to the view for rendering in PDF Viewer.
Refer here to explore the rich set of PDF Viewer features.
An online demo link to view PDF documents using Syncfusion PDF Viewer.
