在从视图中渲染 PDF 之前删除“打印”按钮 - MVC3答案

【问题标题】：Removing a "Print" button Before Rendering PDF from View - MVC3在从视图中渲染 PDF 之前删除“打印”按钮 - MVC3
【发布时间】：2013-08-29 13:44:03
【问题描述】：

我有一个视图，我将其传递给Rotativa (wkhtmltopdf) 以获取视图的 PDF 版本供用户在单击“打印按钮”后打印：

这是渲染视图，如果用户单击“打印”按钮，将转换为 PDF

这是视图中的按钮代码

<div id="print-pdf" align="center">
    <a id="print-me"  class = "print-btn"
   href='@Url.Action("PrintMyView", "Report", 
             new { id = Model.MonthlyReportID, 
                   clubKeyNo = Model.ClubKeyNumber, 
                   month = Model.ReportMonth, 
                   year = Model.ReportYear }, null)'>Print Report</a>
</div>

常识告诉我，我需要在从视图生成 PDF 之前删除按钮，这样用户就不会得到带有按钮的 PDF：

我尝试隐藏按钮 (.hide()) 并删除它 (.remove()) 但 PDF 仍在使用按钮呈现：

<script type="text/javascript">

    $(document).ready(function () {

        $('#print-me').show(); 

        $('#print-pdf').click(function () {
            $('#print-me').hide();
        });
    });


</script>

还有什么我可以在这里尝试的吗？

谢谢！

【问题讨论】：

标签： c# jquery asp.net-mvc-3 wkhtmltopdf

【解决方案1】：

您可以为 PDF 制作一个版本，这样您就可以处理应该打印的内容和不应该打印的内容

在 javascript 中运行的内容不起作用，因为在厄运准备就绪时执行，但 Rotativa 不会执行任何 javascript

所以，你只渲染你需要的东西

@if (Model.mustPrint){ 
    <div id="print-pdf" align="center">
        <a id="print-me"  class = "print-btn"    href='@Url.Action("PrintMyView", "Report",
                     new
                     {
                         id = Model.MonthlyReportID,
                         clubKeyNo = Model.ClubKeyNumber,
                         month = Model.ReportMonth,
                         year = Model.ReportYear
                     }, null)'>Print Report</a> 
    </div>
}

【讨论】：

是的，这个解决方案非常好。我刚刚创建了一个新的视图模型成员并按照您的建议使用它。谢谢

【解决方案2】：

试试这个 CSS：

@media print 
{
    #print-me
    {
        display:none;
    }
}

ref

【讨论】：

在这种情况下，您的答案不起作用，因为 Rotativa 不会在您的浏览器中转换当前视图，当用户发送打印时，这是对服务器的另一个请求，呈现视图并转换为pdf

【解决方案3】：

Rotativa 不呈现为打印媒体，但作为浏览器，您必须强制呈现为打印。发送“--print-media-type”参数

这样做你可以使用 css 来隐藏是否要打印的媒体

@media print {
.noprint {
display: none! important
}}

例如：

    return new ViewAsPdf("Details", obj)
                    {
                        CustomSwitches = "--print-media-type"
}

完整示例：

return new ViewAsPdf("Details", obj)
                {
                    CustomSwitches = "--print-media-type",
                    FileName = your_name_report.pdf",
                    PageOrientation = Orientation.Portrait,
                    PageSize = Size.A4,
                    PageMargins = new Margins(0, 0, 0, 0),
                    PageWidth = 210,
                    PageHeight = 297
                };

【讨论】：