反馈已提交

网络繁忙

当前为10.0版本文档,只有最新版本的文档支持在线编辑修改,如果想创建/编辑文档,请移步至 最新版帮助文档

JS实现批量选择数据并打印

  • 文档创建者:文档助手1
  • 历史版本:22
  • 最近更新:RosieY 于 2021-11-16
  • 1. 概述

    1.1 问题描述

    填报时希望将选中的数据以自定义的样式打印出来,效果如下图所示:

    前端填报时复选几条数据:

    222

    点击打印按钮后,数据展示为自定义的样式:

    222

    1.2 实现思路

    可以设计另外一个有固定格式的模板,此模板设置 ID 参数,用于接收填报模板复选的数据。

    给填报模板的打印按钮添加点击事件,将选中的值以参数的形式传到固定格式的模板中进行打印。

    注:不支持新填报预览;不支持报表冻结。

    2. 示例

    2.1 新建固定格式模板

    1)新建数据库查询数据集 ds1,SQL 语句为:SELECT * FROM 产品 where 产品ID in (${ID})

    Snag_1e3f2397.png

    2)设计表格样式,将数据集字段拖到对于单元格中,如下图所示:

    Snag_1e430676.png

    3)将 B2 单元格的左父格设置成,如下图所示:

    Snag_1e47eceb.png

    4)并将其余单元格的左父格设置为B2,如下图所示:

    Snag_1e4981b4.png

    5)设置 B3 单元格的形态,前端展示时该单元格可以显示供应商的公司名称,如下图所示:

    Snag_1e4cb076.png

    6)设置 D3 单元格的形态,前端展示时该单元格可以显示产品的类别名称,如下图所示:

    Snag_1e4dd6d6.png

    7)将模板重命名为:PrintCol.cpt,保存模板,保存路径为:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Form\FormFAQ\PrintCol.cpt

    2.2 设计填报模板

    1)打开设计器内置模板:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Form\LineForm\LineForm7.cpt

    2)选中 B2 单元格的按钮控件,将按钮名字修改为打印,并修改按钮的点击事件,如下图所示:

    1600308233186988.png

    JavaScript 代码如下:

    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)将模板重命名为:PrintOtherStyle.cpt,保存模板。

    2.3 效果预览

    填报预览PrintOtherStyle.cpt,复选几条数据后,点击打印按钮,打印出来的效果如 1.1问题描述 中所示。

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

    3. 模板下载

    已完成模板可参见:

    %FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Form\FormFAQ\PrintCol.cpt

    %FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Form\FormFAQ\PrintOtherStyle.cpt

    点击下载模板:

    PrintCol.cpt

    PrintOtherStyle.cpt

    附件列表


    主题: 填报应用
    已经是第一篇
    已经是最后一篇
    • 有帮助
    • 没帮助
    • 只是浏览

    售前咨询电话

    400-811-8890转1

    在线技术支持

    请前往「服务平台」,选择「在线支持」

    热线电话:400-811-8890转2

    总裁办24H投诉

    热线电话:173-1278-1526