历史版本18 :JS实现批量选择数据并打印 返回文档
编辑时间: 内容长度:图片数:目录数: 修改原因:

目录:

1. 问题描述编辑


对于填报网格式报表,每行前面有个复选框,希望实现点击页面中设置的打印按钮可以将选中的复选框中的值按照一定的样式打印,如分栏、页面固定显示几行等格式。

2. 实现思路编辑

可以定义另外一个有固定格式的模板,此模板的数据是根据填报网格式报表中选中的值进行过滤,而在填报网格式报表中则需要在按钮的点击事件中定义js,js首先要获取选中行的数据,然后调用FineReport内置的打印方法,将选中的值以参数的方式加入到打印方法的URL中传到被打印的模板中。

3. 示例编辑

预览模板效果如下所示
222

选中一些数据让其按照以如下图所示的样式进行打印,下面我们来看下具体的实现步骤。
222

3.1 新建需要打印格式模板

1)定义数据集

由于此模板要根据选中的值进行打印,因此要在此模板中定义参数,在此我们将参数定义成数据集参数。

新建工作簿,增加数据集ds1,SQL语句为:SELECT * FROM 产品 where 产品ID in (${ID})

2)表样设计

将表样设计成要打印的效果,在此我们将模板设置成如下样式:

222

将B2单元格的左父格设置成无,并将其余单元格的左父格设置为B2,A7单元格的左父格设置成A1。

将B3和D3设置形态

同样也可以对模板进行分栏

3)保存模板

保存模板,具体的设置可参考模板:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Form\FormFAQ\PrintCol.cpt


3.2 修改预览模板

1)打开模板

打开模板:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Form\LineForm\LineForm7.cpt

2)修改模板

此模板,我们只要修改按钮的名称和按钮的js即可,因此我们将按钮名称修改成“打印”,并将js修改成如下代码:

var $span = $('.fr-checkbox-checkon');  //获取选中的复选框
var darray = [];
var $tds = $("td").has($span); //获得选中复选框的单元格
for (var i = 0, len = $tds.length; i < len; i ++) {    //遍历选中的单元格
   var id = $($tds[i]).attr("id");  //给选中的单元格增加id属性
var idn = id.replace("A","B"); //将复选框所在的A列换成客户编号所在的B列
var vv=document.getElementById(idn).innerHTML;    //获取选中单元格所在B列的数据
  darray.push(vv);  
}
FR.doURLPDFPrint("${sevletURL}report?viewlet=/doc/Form/FormFAQ/PrintCol.cpt&ID="+darray);  //调用打印方法,URL为之前做好的模板路径

注:若获取的vv值为字符串,要将其放入数组中则需要修改成darray.push("'"+vv+"'")。

3)保存模板

保存模板,具体的设置可参考模板:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Form\FormFAQ\PrintOtherStyle.cpt

3.3 效果查看


填报预览PrintOtherStyle.cpt,选中几行数据后,点击打印按钮,就会按照上图的效果进行打印。在线查看模板效果请点击PrintOtherStyle.cpt



4. 移动端编辑


移动端不支持各种打印和导出方式