Export HTML Div (with Hindi Unicode content) to PDF in ASP.NET

• Download source - 8.7 MB

Introduction

It's a very tough time when we have to generate PDF from HTML (having Unicode content) in ASP.NET. Though we have several options like RDLC, Crystal Reports, itextsharp library, etc., RDLC and Crystal Reports are better when we go through server side programming and itextsharp lacks functionality when it comes to Unicode support like Hindi Unicode fonts. But what when we are using JQuery in ASP.NET and want to export a div content to PDF as we see on browser.

It's the time to use NReco PDF Generator. It's a wrapper for WkHtmlToPdf tool. We can also use WkHtmlToPdf tool but Nreco is simple and mostly everything is readymade.

What We Must Know

1. Jquery (jquery-2.1.3.min.js has been used in the demo)
2. Web Handler

Using the Code

Let's go step by step to make things work.

1. First, we add NReco.PdfGenerator.dll to the bin folder of our project. You can download the DLL from NReco's official website or you can get the DLL from the demo attached to the post.
2. Add reference to the following two JS in Head section. ExportToPDF.js can be found in the demo. It has got the function that sends HTML to Web Handler.

     <script src="scripts/jquery-2.1.3.min.js"></script>
     <script src="scripts/ExportToPDF.js"></script>

3. Now add the function on click event of button that casts the spell.

       <script type="text/javascript">
           $(document).on('click', '#btnPrint', function () {
               ExportToPDF($('#divtoPrint'),[], '??????? ???????', PDFPageType.Portrait);
           });
       </script>

   The function has 4 parameters:

   • The first one is for the HTML content that we want to print. In our demo, we have provided the div having Id 'divtoPrint' to our function as first parameter that means we will be getting all the HTML of the div by using Jquery selector $('#divtoPrint').
   • Second is an Array for the table inside that Div. If you wish to hide some columns of the Table, for example, if you wish to hide first and second column of the Table, then you will have to pass [0,1] as second parameter of the function.
   • The third parameter is the Heading of the Report.
   • The fourth parameter is the Page Type. PDFPageType is an enum. It has 3 options to choose from, i.e., Default,Portrait and Landscape. If you wish to print our HTML as Landscape, then we have to choose PDFPageType.Landscape and so on.

   You can also create several functions. The code is very simple. You can easily understand it and modify it according to your requirement.

4. Now we add our Web Handler ExportHandler.ashx. You can get the handler in the demo. I have explained the handler functionality in depth in the demo and properly commented wherever needed.
5. Now just run the page and click the print button. Wow...!!!! We have converted our HTML to PDF.

Point of Interest

I will provide further explanations in future updates. Web Handler has got NReco functionality. You can change several settings in it as per your requirements.