Printing PDF in ASP.NET Core 3.1 Razor Pages

Question

In my quest to learn ASP.NET core I've created a simple CRUD application using asp.net core 3.1. I want to print my Details page as a Invoice. I have looked around and it seems like printing PDF in full .NET Framework was more available.

Can anyone point me in the right direction? I have come across free libraries like SelectPDF, WKHTMLTOPDF, PDFSharp but quiet frankly the samples are pre- asp.net core and cannot quiet integrate it with ASP.NET Core Razor Pages. Actually, if I'm not mistaken some of the libraries mentioned above are not compatible with Razor Pages.

Answer 1

You can also check with Syncfusion, they have a great library.

https://www.syncfusion.com/pdf-framework/net-core/pdf-library

Answer 2

Disclaimer: I work for SelectPdf.

SelectPdf does support ASP.NET Core + Razor Page. Samples are available via download from SelectPdf website.

Sample code here:

@page
@model SelectPdf.Samples.Pages.ConvertUrlToPdfModel
@{
    Layout = "~/Pages/_Layout.cshtml";
    ViewData["Title"] = "SelectPdf Free Html To Pdf Converter for .NET Core - Convert from Url to Pdf - C# / ASP.NET Core MVC6";
    ViewData["Description"] = "SelectPdf Convert from Url to Pdf Sample for C# ASP.NET MVC. Pdf Library for .NET with full sample code in C# and VB.NET.";
    ViewData["Keywords"] = "convert from url to pdf, pdf library, sample code, html to pdf, pdf converter";
}

<form method="post">
    <article class="post type-post status-publish format-standard hentry">
        <header class="entry-header">
            <h1 class="entry-title">SelectPdf Free Html To Pdf Converter for .NET Core - Convert from Html to Pdf - C# / ASP.NET Core MVC6 Sample</h1>
        </header>
        <!-- .entry-header -->

        <div class="entry-content">
            <p>
                This sample shows how to use SelectPdf html to pdf converter to convert an url to pdf, also setting a few properties.
            </p>
            <p>
                Url:<br />
                <input type="text" style="width: 90%;" value="https://selectpdf.com" asp-for="TxtUrl" />
            </p>
            <div class="col2">
                Pdf Page Size:<br />
                <select asp-for="DdlPageSize" asp-items="Model.PageSizes"></select>
                <br />
                <br />
                Pdf Page Orientation:<br />
                <select asp-for="DdlPageOrientation" asp-items="Model.PageOrientations"></select><br />
                <br />
            </div>
            <div class="col2">
                Web Page Width:<br />
                <input type="text" style="width: 50px;" value="1024" asp-for="TxtWidth" /> px<br />
                <br />
                Web Page Height:<br />
                <input type="text" style="width: 50px;" value="" asp-for="TxtHeight" /> px<br />
                (leave empty to auto detect)<br />
                <br />

            </div>
            <div class="col-clear"></div>
            <p>
                <input type="submit" name="BtnConvert" value="Create PDF" class="mybutton" />
            </p>
        </div>
        <!-- .entry-content -->
    </article>
</form>

// C# code below

using System;
using System.Collections.Generic;
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
using Microsoft.AspNetCore.Mvc.Rendering;

namespace SelectPdf.Samples.Pages
{
    public class ConvertUrlToPdfModel : PageModel
    {
        public void OnGet()
        {
            DdlPageSize = "A4";
        }

        [BindProperty]
        public string TxtUrl { get; set; }

        [BindProperty]
        public string DdlPageSize { get; set; }

        public List<SelectListItem> PageSizes { get; } = new List<SelectListItem>
        {
            new SelectListItem { Value = "A1", Text = "A1" },
            new SelectListItem { Value = "A2", Text = "A2" },
            new SelectListItem { Value = "A3", Text = "A3" },
            new SelectListItem { Value = "A4", Text = "A4" },
            new SelectListItem { Value = "A5", Text = "A5" },
            new SelectListItem { Value = "Letter", Text = "Letter" },
            new SelectListItem { Value = "HalfLetter", Text = "HalfLetter" },
            new SelectListItem { Value = "Ledger", Text = "Ledger" },
            new SelectListItem { Value = "Legal", Text = "Legal" },
        };

        [BindProperty]
        public string DdlPageOrientation { get; set; }

        public List<SelectListItem> PageOrientations { get; } = new List<SelectListItem>
        {
            new SelectListItem { Value = "Portrait", Text = "Portrait" },
            new SelectListItem { Value = "Landscape", Text = "Landscape" },
        };

        [BindProperty]
        public string TxtWidth { get; set; }

        [BindProperty]
        public string TxtHeight { get; set; }

        public IActionResult OnPost()
        {
            // read parameters from the webpage
            PdfPageSize pageSize =
                (PdfPageSize)Enum.Parse(typeof(PdfPageSize), DdlPageSize, true);

            PdfPageOrientation pdfOrientation =
                (PdfPageOrientation)Enum.Parse(typeof(PdfPageOrientation),
                DdlPageOrientation, true);

            int webPageWidth = 1024;
            try
            {
                webPageWidth = System.Convert.ToInt32(TxtWidth);
            }
            catch { }

            int webPageHeight = 0;
            try
            {
                webPageHeight = System.Convert.ToInt32(TxtHeight);
            }
            catch { }

            // instantiate a html to pdf converter object
            HtmlToPdf converter = new HtmlToPdf();

            // set converter options
            converter.Options.PdfPageSize = pageSize;
            converter.Options.PdfPageOrientation = pdfOrientation;
            converter.Options.WebPageWidth = webPageWidth;
            converter.Options.WebPageHeight = webPageHeight;

            // create a new pdf document converting an url
            PdfDocument doc = converter.ConvertUrl(TxtUrl);

            // save pdf document
            byte[] pdf = doc.Save();

            // close pdf document
            doc.Close();

            // return resulted pdf document
            FileResult fileResult = new FileContentResult(pdf, "application/pdf");
            fileResult.FileDownloadName = "Document.pdf";
            return fileResult;

        }
    }
}

Answer 3

I have come across free libraries like SelectPDF, WKHTMLTOPDF, PDFSharp but quiet frankly the samples are pre- asp.net core and cannot quiet integrate it with asp.net core Razor Pages.

I suggest that you could use client side library.Because what you metioned are all server side libraries,they all need to find the view and convert to string.As far as I known,it seems no such direct method to convert razor pages to string.So I suggest that you could use jsPDF library.

Here is a whole working demo:

@page
@model DetailsModel
<div id="details">       //be sure add this id...

    <h1>Details</h1>

    <div>
        <h4>test</h4>
        <hr />
        <dl class="row">
            <dt class="col-sm-2">
                @Html.DisplayNameFor(model => model.test.Name)
            </dt>
            <dd class="col-sm-10">
                @Html.DisplayFor(model => model.test.Name)
            </dd>
        </dl>
    </div>
    <div>
        <a asp-page="./Edit" asp-route-id="@Model.test.Id">Edit</a> |
        <a asp-page="./Index">Back to List</a>
    </div>
</div>

<button onclick="javascript:demoFromHTML();">Generate PDF</button>

@section Scripts
{
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.2/jspdf.min.js"></script>
    <script>
        function demoFromHTML() {
            var pdf = new jsPDF('p', 'pt', 'letter');
            // source can be HTML-formatted string, or a reference
            // to an actual DOM element from which the text will be scraped.
            source = $('#details')[0];

            // we support special element handlers. Register them with jQuery-style
            // ID selector for either ID or node name. ("#iAmID", "div", "span" etc.)
            // There is no support for any other type of selectors
            // (class, of compound) at this time.
            specialElementHandlers = {
                // element with id of "bypass" - jQuery style selector
                '#bypassme': function (element, renderer) {
                    // true = "handled elsewhere, bypass text extraction"
                    return true
                }
            };
            margins = {
                top: 80,
                bottom: 60,
                left: 40,
                width: 522
            };
            // all coords and widths are in jsPDF instance's declared units
            // 'inches' in this case
            pdf.fromHTML(
                source, // HTML string or DOM elem ref.
                margins.left, // x coord
                margins.top, { // y coord
                'width': margins.width, // max width of content on PDF
                'elementHandlers': specialElementHandlers
            },

                function (dispose) {
                    // dispose: object with X, Y of the last line add to the PDF
                    //          this allow the insertion of new lines after html
                    pdf.save('Test.pdf');
                }, margins);
        }
    </script>
}