创建用于使用JavaScript打印报告的模板

创建用于使用JavaScript打印报告的模板,javascript,printing,knockout.js,Javascript,Printing,Knockout.js,我有一些通过表单进行的查询,并发送到Asp.NETMVC操作,该操作返回一个包含所有结果的JSon 根据这个结果,我设置了一个KnockoutJs Observable数组,它用数组中的项填充一个表,并处理分页 我想让这个结果表“可打印” 我正在尝试使用JS来实现这一点 我打算做的是实现如下内容: function print(data){ while(!data.IsEmpty()) DisplayHeader(); //Gets some HTML for the h

我有一些通过表单进行的查询,并发送到Asp.NETMVC操作,该操作返回一个包含所有结果的JSon

根据这个结果,我设置了一个KnockoutJs Observable数组,它用数组中的项填充一个表,并处理分页

我想让这个结果表“可打印”

我正在尝试使用JS来实现这一点

我打算做的是实现如下内容:

function print(data){
    while(!data.IsEmpty())
        DisplayHeader(); //Gets some HTML for the header from the server
        while(!EndOfPage())
            displayRow(data)
        DisplayFooter()    
}
其中大多数都很容易实现,但我的问题是

如何检测分页符/页面结束,以便显示页脚并开始一个全新页面?(假设它将打印为A4大小)

以下是我试图完成的工作示例:

这是一个和弦和歌词巴西网站

请看这一页:

它是可打印的版本:


检查源代码时,它使用一些JS来读取原始页面,然后创建“可打印”版本。

请接受我的建议,与完成HTML打印时的鳄鱼眼泪相比,使用PDF服务器库更好。虽然有一两个PDF Javascript库,但我认为它们也有问题。然而,这些都是你在这里寻找的。您只需对使用PDF打印有无限多的控制。编辑:无需担心。您需要使用一些方法来计算内容的高度、行的显示高度,并使用计算来确定内容的位置。Jared,看看我发布的工作示例,你就会明白我的意思。关于使用iText在服务器端创建PDF,我尝试过,但我不会从HTML中获得相同的布局和设计,我尝试使用单个HTML模板并将其用于显示和打印,在服务器端创建PDF我必须为PDF重新创建模板,想象一下有几百张表格…我明白你的意思。您只需计算高度,记住一些浏览器允许您缩小可打印区域(我将Firefox保持在70%左右)。不熟悉iText,但许多像TCPDF的人都允许您使用HTML,并对其进行一些调整。例如,请参阅TCPDF示例页面上的
writeHTML
示例:如果您有PHP,这是一个选项。还有一些扩展的CSS打印属性,我记不起它们的名字了,但我知道它们在不同的浏览器中是不稳定的。HTML只是打印不好,至少现在是这样。我不太确定TCPDF是否会有帮助。我的服务器端代码是Asp.NETMVC。