将HTML表拆分为列组

时间:2017-01-16 14:55:33

标签: javascript html css printing flying-saucer

我想以PDF格式打印非常宽(可能很高)的HTML表格。这些表是使用Javascript中的Handlebars模板生成的,HTML到PDF的位是使用Flying Saucer的基于Spring的Java服务器。

我知道,通常情况下,使用单独的print.css文件进行打印,并将纸张设置为横向等。但是,我无法想出一种垂直拆分表格的方法。

所以我认为可以在这里完成的是打印大表,例如,2x2 A4页数组。

表格如下:

+----+----+----+----+----+----+
|____|____|____|____|____|____|
|____|____|____|____|____|____|
|____|____|____|____|____|____|
|____|____|____|____|____|____|

在进入打印机之前(或在放入PDF之前)应该成为这个:

Page 1             Page 2
+----+----+----+   +----+----+----+
|____|____|____|   |____|____|____|
|____|____|____|   |____|____|____|

Page 3             Page 4
+----+----+----+   +----+----+----+
|____|____|____|   |____|____|____|
|____|____|____|   |____|____|____|

作为附加约束,表标题可能有些复杂,具有一些colspan="x"rowspan="2"属性。它不会超过2行标题,而是一个'分组'第一行中的列可以跨越第二行中的两列以上,例如

+-----------------------------------------------------------------------+
|                       |    Group1     |       |       Group2          |
| Head1 | Head2 | Head3 | Head4 | Head5 | Head6 | Head7 | Head8 | Head9 |

实际问题

考虑到这一切,除了使用像jQuery这样的东西来遍历列,将表拆分为更小的表(同时考虑到不打破列组)并添加分散的行,我还有其他选择吗?相应的子表?

1 个答案:

答案 0 :(得分:2)

我一直在研究如何做到这一点,据我所知,如果不使用大量的JavaScript来进行大量的操作,就没有办法做到这一点。

这里的第一个答案就是我将要作为一个起点: Print a very wide HTML table without clipping right hand side

希望这有帮助。