In a recent project I needed to display a generated PDF contract document inside the browser. I found a great article by Patrick Kalkman illustrating how to create a custom ActionResult that converts a HTML string into a PDF using the iTextSharp library.
This seemed like the perfect solution, however, I later found that the conversion from HTML to PDF is not perfect at all and getting your design to look the same in PDF as it does in HTML is not easy. So I found another article by Hasibul Haque, where he shows how to return a Crystal Report as PDF using ASP.Net MVC.
The Crystal Report approach works well, as your design will look perfect. The only problem I had was Hasibul’s approach returned the PDF as a download and I wanted to display it inside the browser. I combined Patrick and Hasibul’s approaches and what I came up with was a CrystalReportPdfResult
The CrystalReportPdfResult is an ASP.Net ActionResult, that return the Crystal Report as a PDF file. The result (using an iframe) looks like this inside the browser:
Creating the CrystalReportPdfResult class
To generate the result as indicated by the previous image, follow these steps:
- Create a folder inside your ASP.Net MVC project called Pdf.
- Add a new class to this folder called CrystalReportPdfResult.cs.
- The new class will inherit from the ASP.Net MVC ActionResult class.
The entire code listing for the CrystalReportPdfResult class follows:
Creating the Crystal Report
Next, we need to create the Crystal Report that will be returned as a PDF. Do this by following these steps:
- Create a new folder called Reports in your project.
- Add a new Crystal Report object to the Reports folder. You can find the item template under the Reporting tab on the Add New Item dialog.
- Design the report to your liking and save it.
- If you need to install Crystal Reports for Visual Studio 2013, get it here.
Creating the Action that will return the PDF
Next, we need to create the actual Action on a Controller that will return the CrystalReportPdfResult, by following these steps:
- Open your controller. In this example, we’ll use the HomeController.
- Add a new method called Pdf that will return a CrystalReportPdfResult object.
- Inside this method, we’ll build a list of customer that will be used as data for the report and build the path to the report filename. The code for the method follows:
Creating the View
We’ll embed the PDF using an <iframe>, so open a view. In this case we’ll use About.cshtml and replace it’s mark-up with the following:
Note, that we’re using the @Url.Action helper to set the src attribute of the <iframe> element. This will make a call to the Pdf action on the Home controller and render the result inside the <iframe>
I’ve tested this on the latest version of Chrome, Firefox and Internet Explorer and it works on all of them.
Hope this helps someone that needs something similar. Thank you for reading. Until next time, keep coding!
Download the sample project here.
If you have any comments or questions, please feel free to ask leave a comment or drop me a line on Twitter.