使用 Rotativa 生成 PDF 从视图中分页数据继续在第二页的 header 忽略 CSS

Using Rotativa to generate PDF From a view when the page breaks data continue on the header of the second page disregarding CSS

我已经尝试了很多答案并得出结论,即使是开发人员自己也没有答案,我有一个由复杂模块创建的索引页面,视图接收带有 ActionAsPdf 的模块并生成PDF 除非分页 table 继续在下一页覆盖 table headers.

顶部的记录
public ActionResult PrintRoster(Guid id)
    {
        string footer = "--footer-right \"Date: [date] [time]\" " + "--footer-center \"Page: [page] of [toPage]\" --footer-line --footer-font-size \"9\" --footer-spacing 5 --footer-font-name \"calibri light\"";

        return new ActionAsPdf("RosterPDF", 
                            new { id = id }) { FileName = "ClassRoster.pdf",
                                                PageSize = Rotativa.Options.Size.A4,
                                                PageOrientation = Rotativa.Options.Orientation.Portrait,
                                                MinimumFontSize = 16,
                                                PageMargins = {Top = 15, Bottom = 22},
                                                PageHeight = 40,
                                                CustomSwitches = footer
                            };
    }

创建 RosterPDF,然后生成相关 PDF

@model Training.ViewModels.RosterViewModel
@using Training.UtilModels
@{
    Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="~/Content/bootstrap.min.css" rel="stylesheet" />
<link href="~/Content/trstyle.css" rel="stylesheet" />
<link href="~/Content/themes/base/css" rel="stylesheet" />
<link href="~/Content/Print.css" rel="stylesheet" media="print" />
<title></title>
</head>
<body>  
<h1 class="text-center">Class Attendance</h1>
<hr>
<div class="row">
    <div class="col-sm-4 text-justify"> <strong> Class Name: </strong> @Model.MClass.ClassName </div>
    <div class="col-sm-4 text-justify"> <strong>Instructor: </strong> @Model.MClass.Instructors.FirstOrDefault().FullName</div>
</div>
<div class="row">
    <div class="text-justify col-sm-4"> <strong> Section Number: </strong> @Model.MClass.SectionNumber </div>
    <div class="col-sm-4 text-justify"> <strong>Term: </strong> @Model.MClass.Term.TermName</div>
</div>
<div class="row">
    <div class="text-justify col-sm-4"> <strong> Location: </strong> @Model.MClass.TLocation.LocationName </div>
    <div class="col-sm-4 text-justify"> <strong>Year: </strong> @Model.MClass.ClassStartDate.Year</div>
</div>
<hr>

<table id="Events" class="table table-bordered table-striped page-breaker">

    <thead>
        <tr>
            <th>Name</th>
            <th>Payroll<br /> Number</th>
            @for (int i = 1; i <= Model.MClass.Course.NoDays; i++)
            {
                <th>@BusinessDay.AddWorkDays(Model.MClass.ClassStartDate, i).AddDays(-1).ToShortDateString()</th>
            }
        </tr>
    </thead>
    <tbody>
        @foreach (var x in Model.ClassAttendances)
        {
            <tr>
                <td><strong>@x.StudentName</strong></td>
                <td>@x.PayrollNo</td>
                @for (int i = 0; i < Model.MClass.Course.NoDays; i++)
                {
                    <td>@(x.AttendanceCodeId.ElementAt(i) != 0 ? x.AttendnaceCodes.Where(t => t.Value == x.AttendanceCodeId.ElementAt(i).ToString()).Select(t => t.Text).FirstOrDefault() : "")</td>
                }
            </tr>
        }
    </tbody>
    <tfoot style="page-break-after: always;">
        <tr>
            <td colspan="10" class="page-breaker">
                <strong>STUDENTS: Please make any corrections to your name or number directly on this form.</strong>
            </td>
        </tr>
    </tfoot>
</table>

输出结果如下

The output

我通过在 css 中添加这个解决了类似的问题:

tr {
    page-break-inside: avoid;
}

希望对你有用。