Post
Ask Question

Create PDF Using RazorPDF in ASP.Net MVC

This article explains how to create a PDF in Razor View using RazorPDF in MVC. RazorDPF is a package that uses iTextSharp internally. 

We will create a simple marks card example to see the RazorPDF package. Let's create a ASP.NET MVC 4 project, as shown in Figure 1.1.
 
Select "ASP.NET MVC 4 Web Application" and click on the "OK" button. This brings up the dialog box to select the MVC templates.
 
Figure 1.1.JPG
 
Figure 1.1
 
Select Internet Application template and ensure that Razor is selected as the view engine, as shown in Figure 1.2.
 
Figure 1.2.JPG
 
Figure 1.2
 
Install RazorPdf using NuGet Package Manager
 
Right-click on the References node in Solution Explorer, as shown in Figure 1.3. Click on "Manage NuGet Packages". This brings up the NuGet Manage Package dialog box, that is used to install the RazorPDF package.
 
Figure 1.3.JPG
 
Figure 1.3
 
The NuGet dialog box lists installed packages by default, so click on the online tab, as shown in Figure 1.4.
 
Figure 1.4.JPG
 
Figure 1.4
 
Type "RazorPDF" in the search bar in the top-right side of NuGet. Once you find the RazorPDF, click on the install button to install the RazorPDF package in your project. Once installation is finished, automatically iTextSharp and RazorPDF will be added as a reference in your project, as shown in Figure 1.5.

Figure 1.5.JPG 
 
Figure 1.5
 
Create a Marks Card Model 
 
Create a class "MarksCard" to model the marks card.
  1. namespace RazorPDFDemo.Models  
  2. {  
  3.     public classMarksCard  
  4.     {  
  5.        public int RollNo  
  6.         {  
  7.            get;  
  8.            set;  
  9.         }  
  10.         public string Subject  
  11.         {  
  12.            get;  
  13.            set;  
  14.         }  
  15.         public int FullMarks  
  16.         {  
  17.            get;  
  18.            set;  
  19.         }  
  20.        public int Obtained { get; set; }  
  21.     }  
  22. } 
Once you have created the MarksCard class, build your project. So we can create the strongly typed view. 
 
Create Controller for StudentMarks
 
Right-click on the Controllers folder then select "Add" -> "Controller", as shown in Figure 1.6. 
 
Figure 1.6.JPG
 
Figure 1.6
 
The Controller dialog box will open, as shown in Figure 1.7. Change the controller name to Students and select "Empty API controller" in the Scaffolding template and click on the "Add" button.
 
Figure 1.7.JPG
 
Figure 1.7
 
We will create a list and store some data in the list. See the following code:
  1. using System.Collections.Generic;  
  2. using System.Web.Mvc;  
  3. using RazorPDFDemo.Models;  
  4. namespace RazorPDFDemo.Controllers  
  5. {  
  6.    public class StudentsController : Controller  
  7.     {  
  8.         //// GET: /Students/  
  9.         public ActionResult Index()  
  10.         {  
  11.             var studentMarks = new List<MarksCard>()  
  12.             {  
  13.                 new MarksCard()  
  14.                 {  
  15.                     RollNo = 101, Subject = "C#",  
  16.                 FullMarks = 100, Obtained = 90},new MarksCard() {RollNo = 101, Subject = "asp.net", FullMarks = 100, Obtained = 80},new MarksCard() {RollNo =               101, Subject = "MVC", FullMarks = 100,  
  17.                 Obtained = 100},new MarksCard() {RollNo = 101, Subject = "SQL Server", FullMarks = 100, Obtained = 75},  
  18.                 };  
  19.                 return new RazorPDF.PdfResult(studentMarks, "Index");  
  20.             }  
  21.         }  
  22.     }  
  23. }

Now our controller is ready. We need to create a view to display this marks card. Right-click on the Index() controller and click on "Add View". A view dialog box will be displayed, as shown in Figure 1.8. Make sure that Razor is selected in the view engine.

Select MarksCard in the Model class and click on the "Add" button.
 
Figure 1.8.JPG

Figure 1.8
 
The view will be created for the marks card. I have done some cosmetic changes in the view to make the look and feel like a marks card, see the following view code:  
  1. @model IEnumerable  
  2. <RazorPDFDemo.Models.MarksCard>  
  3. @{Layout = null;    
  4. }    
  5. <!DOCTYPE html>    
  6. <html>  
  7.    <body>  
  8.       <table border="1" width='500' bordercolor="RED">  
  9.          <tr>  
  10.             <td colspan="3" bgcolor="LightGreen" align="center" valign="top">SSLC Marks Sheet 2013</td>  
  11.          </tr>  
  12.          <tr>  
  13.             <td>@{ var rollNumber = Model.Select(z => z.RollNo).Take(1).ToArray();}Riyaz Akhter<br />RollNo:@rollNumber[0]</td>  
  14.             <td colspan="2" align="left"><img src="@Server.MapPath("~/Images/images.jpg")" width="100" height="100"/></td>  
  15.          </tr>  
  16.          <tr>  
  17.             <td bgcolor="lightblue">@Html.DisplayNameFor(moel => moel.Subject)</td>  
  18.             <td bgcolor="lightblue">@Html.DisplayNameFor(model => model.FullMarks)</td>  
  19.             <td bgcolor="lightblue">@Html.DisplayNameFor(model => model.Obtained)</td>  
  20.          </tr>  
  21.          @{int total = 0;}@foreach (var item in Model){  
  22.          <tr>  
  23.             <td>@Html.DisplayFor(modelItem => item.Subject)</td>  
  24.             <td>@Html.DisplayFor(modelItem => item.FullMarks)</td>  
  25.             <td>@Html.DisplayFor(modelItem => item.Obtained)</td>  
  26.          </tr>  
  27.          total += item.Obtained;}  
  28.          <tr>  
  29.             <td></td>  
  30.             <td><strong><font color="GREEN">Total</font></strong></td>  
  31.             <td>@total</td>  
  32.          </tr>  
  33.       </table>  
  34.    </body>  
  35. </html>
In the code above, I have changed the default layout to null and also I have added <html> and <body> tags.
 
Now your application is ready to run. Once you run the application it will look as in Figure 1.9.
 
Figure 1.9.JPG
 
Figure 1.9
 
Now we will convert this view to PDF. Go to your student controller and make a small change in your controller, as shown in Figure 1.10. 
 
Figure 1.10.JPG
 
Figure 1.10
 
Yes, that's it. pdfResult is a method in the RazorPDF class that takes a model object and view name as a parameter or you can pass a model object without an action name if your action name is a PDF.
 
Now run your application. This time the PDF will be displayed instead of your view, as shown in Figure 1.11.
 
Figure 1.11.JPG
 
Figure 1.11
 
It is very easy to create a PDF using RazorPDF in ASP.NET MVC.


Similar Articles