讨论一下关于window.print()分页的问题

[chuanzhang5687]

首先页面上的每一条数据都是一个table，用的是Repeater控件，里面填充一个table数据集
然后交叉显示每一个数据集
显示结果为
1，2
3，4
5，6
数字代表着Repeater控件里面交叉的数据集
根据A4纸的大小，可以知道每张打印多少数据（7行两列）每一个单元格都是一个数据集也就是Repeater控件里面
绑定的数据集

然后将数据打印出来，数据多的时候，就得要求一个分页显示的效果（这个效果在打印的时候出现就好）
要不然打印出来的数据，上一页跟下一页之间的一条数据（数据集）有可能是分开的

如果在页面上显示的时候加上几个linkbutton来实现上一页下一页的话，那么window.print() 也就是说只打印当前页
所以如果数据很多的话，那么按打印按钮来打印每一页，未免有点麻烦；

怎么样才能单击打印按钮，一下子把数据全部打印，打印出来的带分页效果

之前看到过 把每页的最后一行设置个属性，让它分页，但是对于我这种用Repeater控件绑定的数据适合吗
如果可以的话，那么我在Repeater事件里面 加个计数器，每多少条数据分 一下，这种可以考虑不；

有做过window.print() 打印的同学，进来聊聊，你们打印的时候都是怎么处理这些问题的

[jxj0115]

全部数据显示出来打印，window.print应该会自动分页的吧，只是分页的位置估计不能自己控制

[jxj0115]

全部显示打印，window.print应该会自动分页的吧

[jxj0115]

全部显示打印，window.print应该会自动分页的吧，只是不能精确分页

[chuanzhang5687]

假设一张A4纸能打印20条数据
如果我要打印500调数据
按照这种分页打印的话
需要显示25页，也就是说我要单击二十五次打印按钮
这对用户体验来说，应该不算很友好吧[Quote=引用 12 楼 chenlitong_521 的回复:]

建议分页打印，不要全部打印出来再分页.........这样可能会比较简单了~~~
[/Quote]

[chuanzhang5687]

会自动分页，也就是你说的 不能精确分页
现在就是要解决这个精确分页问题[Quote=引用 14 楼 jxj0115 的回复:]

全部显示打印，window.print应该会自动分页的吧
[/Quote]

[orain]

肯定是只能多少条数据加一个分页，想计算出显示在页面上的高度然后根据高度来添加分页，很难（好像其实也可以，用 JS 来计算表格高度，然后在合适的高度下添加分页，不过就是比较麻烦，从后端就别想了，太难）。按条数添加分页很好做啊，比如 20 条分页：
for(int i = 0; i < len; ++i)
{
　　if(i != 0 && i % 20 == 0)
　　　　插入分页
}

[IT-Style]

按照条数以及每一条的高度计算，当>=A4纸的高度时加入
<br style="page-break-after:always;" />
--在此处也可以加入表头
然后打印时应该就自动分页了!

[chuanzhang5687]

就是这个思路
但是我不知道在该怎么加入
<br style="page-break-after:always;" />
这个东西
首先，我用的是一个reapeter控件
控件里面是个table
多少条数据也就是多少个table
我怎么在 第20个table里面加上这段东西
[Quote=引用 22 楼 orain 的回复:]
肯定是只能多少条数据加一个分页，想计算出显示在页面上的高度然后根据高度来添加分页，很难（好像其实也可以，用 JS 来计算表格高度，然后在合适的高度下添加分页，不过就是比较麻烦，从后端就别想了，太难）。按条数添加分页很好做啊，比如 20 条分页：
for(int i = 0; i < len; ++i)
{
　　if(i != 0 && i % 20 == 0)
　　　　插入……
[/Quote]

[orain]

如果你用的是 Repeater，那就直接在绑定表达式里加 Style 就可以了，如
<table style="<%# Container.ItemIndex > 0 && Container.ItemIndex % 20 == 0 ? "page-break-after:always;" : String.Empty %>">

table 就是你绑数据的 Table，用 br 会破坏你原有的显示结构。

[orain]

应该是 page-break-before，不是 page-break-after，否则会差了一条记录。自己调一下看看吧。

[chuanzhang5687]

按照你所提示的写出来 的html
查看的源文件是这样的

<table>
    <tr>   
        <td>
            <table style="page-break-after:always"></table>
        </td> 
        <td>
            <table></table>
        </td> 
    </tr>
</table>

打印预览里面没分页
但是每各几行的style 效果是显示出来了

[chuanzhang5687]

这些 数据 都是在 最外面的一个 table里面存放着的
这样能出来 分页效果吗 [Quote=引用 25 楼 orain 的回复:]
如果你用的是 Repeater，那就直接在绑定表达式里加 Style 就可以了，如
<table style="<%# Container.ItemIndex > 0 && Container.ItemIndex % 20 == 0 ? "page-break-after:always;" : String.Empty %>">

table 就是你绑数据的 Table，用 ……
[/Quote]

[orain]

这个你要放外层的 tr 里，类似这样：

<table>
<tr>
	<td>
		<table>
			<tr><td>a</td></tr>
		</table>
	</td>
	<td>
		<table>
			<tr><td>a</td></tr>
		</table>
	</td>
</tr>
<tr style="page-break-before:always">
	<td>
		<table>
			<tr><td>a</td></tr>
		</table>
	</td>
	<td>
		<table>
			<tr><td>a</td></tr>
		</table>
	</td>
</tr>
</table>

你可以看下这段 HTML 代码，现在是不是两页了。不要在 Chrome 里，Chrome 好像不支持这个 CSS 特性。IE 和 Firefox 下，都没问题的。

[cfvgodot]

你打印机会给你分页的，你直接一页显示500条数据，然后分页打印就可以了，JS没法控制打印机。。。ACTIVE X行

[chuanzhang5687]

打印机是会自动分页
但是 我的每条数据都是一个表格形式的
所以自动分页的这种方式，会把 我这个表格切成两半；这样就达不到目的了[Quote=引用 30 楼 cfvgodot 的回复:]
你打印机会给你分页的，你直接一页显示500条数据，然后分页打印就可以了，JS没法控制打印机。。。ACTIVE X行
[/Quote]

[chuanzhang5687]

还有点问题，
前提是 一张A4值能打印十几条数据，为了显示效果，我每四条数据一分页

如果我用 page-break-before:always;这种方式打印的话
分页效果是出现了，
如果我有6条数据，每页显示4条数据
第五条和第六条，应该在第二张打印纸上显示
但实际上却在第一张打印纸上显示了

如果我用page-break-after:always 这种方式打印的话
这六条数据全部在一张纸上显示了
[Quote=引用 29 楼 orain 的回复:]
这个你要放外层的 tr 里，类似这样：

HTML code
<table>
<tr>
<td>
<table>
<tr><td>a</td></tr>
</table>
</td>
<td>
<table>
<tr><td>a</td></tr>
……
[/Quote]

[chuanzhang5687]

你这个方法 我知道，但是我的数据是不确定的，你不知道他有多少条数据
现在想到的可能就是在后台做个计数器，
然后每几行加一个样式
这个我在提问的时候写到了
这种不知道可行不
[Quote=引用 19 楼 orain 的回复:]
咦，上次我回过，也是你问的，为什么不试试呢？
First
<br style="page-break-after:always;" />
Second
<br style="page-break-after:always;" />
Third

直接把上面的 HTML 代码 Copy 到一个文本文件中，命名为 .html 文件，在打印预览中可以看到，First 在第一页，Second……
[/Quote]

[orain]

在要分页的那一条数据所属的 DOM 元素上增加样式：page-break-after: always 或 page-break-before: always，一个在这条数据前分页，一个在这条数据后分页。

[orain]

咦，上次我回过，也是你问的，为什么不试试呢？
First
<br style="page-break-after:always;" />
Second
<br style="page-break-after:always;" />
Third

直接把上面的 HTML 代码 Copy 到一个文本文件中，命名为 .html 文件，在打印预览中可以看到，First 在第一页，Second 在第二页，Third 在第三页

[chuanzhang5687]

感谢 orain

这个问题解决了