填报预览JS实例

编辑
  • 文档创建者:印然
  • 浏览次数:18293次
  • 编辑次数:19次
  • 最近更新:Kevin-s 于 2019-06-22
  • 1. 描述

    在对数据进行填报的时候,经常会需要使用 JavaScript 对一些功能进行二次开发,比如说设置填报单元格是否可以编辑,给单元格控件进行赋值等等。

    和 参数面板 类似,首先需要获取 填报预览 下的控件或者单元格,才能对其进行各种方法操作。

    不同于参数界面 JavaScript 的是:填报页面下有一个特殊性,既有单元格又有控件,通过控件来输入数据,编辑数据,控件编辑结束之后,会自动将值传递给控件所在的单元格,所以 JavaScript 获取的时候即可获取到单元格也可以获取到控件,获取单元格只能取值和赋值。

    2. 单元格

    2.1 获取单元格的值

    获取填报页面的单元格的值,有以下几种方法:

    contentPane.getCellValue(sheet号,列号,行号);  //sheet号行号列号是从0开始  
    contentPane.curLGP.getCellValue(列号,行号);    
    contentPane.curLGP.getCellValue(单元格);     
    contentPane.curLGP._get$TDCell(col,row).text()//获取单元格显示值  
    contentPane.curLGP._get$TDCell(单元格).text()

    由于单元格可以设置形态来改变其显示值,故 JavaScript 获取单元格有获取实际值和显示值的区分。

    注:使用 contentPane.curLGP.getCellValue(列号,行号)获取值时不能使用 contentPane.curLGP.getCellValue(列号,"A1")这种形式,可先将 A1 单元格值赋给一个变量再用变量替换。

    2.2 给单元格赋值

    赋值的方式也分为赋显示值和赋实际值,如下:


    contentPane.setCellValue(sheet号,列号,行号,值); //sheet号行号列号是从0开始  
    contentPane.curLGP.setCellValue(列号,行号,值);//给单元格赋显示值,非实际值,不能提交入库     
    contentPane.curLGP.setCellValue(单元格,null,值);//给单元格赋显示值,非实际值,不能提交入库  
    contentPane.setCellValue(列号,行号,值);//给单元格赋实际值,可以提交入库  
    contentPane.setCellValue(单元格,null,值);//给单元格赋实际值,可以提交入库

    2.3 获取当前单元格行列号

    上述给取单元格的值和赋值均是确切知道单元格行列号的,那么,如果单元格行列号是动态的,比如说,修改当前编辑行的单元格的值,那么怎么才能定位到该单元格呢?其 JavaScript 代码如下:


    contentPane.curLGP.getTDRow(contentPane.curLGP.currentTDCell)//获取行号
    contentPane.curLGP.getTDCol(contentPane.curLGP.currentTDCell)//获取列号<br>


    2.4 单元格行列号和单元格的转换

    1)行列号转换为单元格

    能够获取到一个行号 row 和一个列号 col,希望得到该行列号对应的单元格,JavaScript 代码如下:

    FR.columnRow2CellStr({col:1, row:0});//该公式的返回值为B

    1

    2)单元格转换行列号
    知道具体的单元格,希望得到定位该单元格的行列号,JavaScript 代码如下:

    FR.cellStr2ColumnRow('B1');

    3. 控件

    获取填报页面的控件,首先要获取到当前的填报页面对象

    3.1 获取填报页面控件

    1)直接在FR模板中获取填报控件

    首先获取到填报页面对象,直接在 FR 模板中使用 JavaScript,其填报页面对象直接使用 contentPane 即可获取到,那么获取控件的 JavaScript 为:

    contentPane.getWidgetByName("widgetname");//根据控件名
    contentPane.getWidgetByCell("Cell");//根据控件名所在位置

    填报控件是与单元格绑定的,如果单元格可扩展,那么控件也可以扩展,故为扩展出多个同名的填报控件,类似这种获取多个同名控件的 JavaScript 方法为:

    contentPane.getWidgetsByName("widgetname")

    注:使用 contentPane.getWidgetsByName 的时候,返回的是数组。

    2)在 Web 集成页面中获取 FR 填报控件

    在 Web 页面中获取 FineReport 填报报表对象的 JavaScript 为:

    document.getElementById('reportFrame').contentWindow.contentPane

    那么其获取控件的 JavaScript 为:

    document.getElementById('reportFrame').contentWindow.contentPane.getWidgetByName('widgetname')

    获取多个同名控件的 JavaScript 代码为:

    document.getElementById('reportFrame').contentWindow.contentPane.getWidgetsByName('widgetname')

    注:其中 reportFrame 是 Web 页面中嵌入 FineReport 报表的 iframe

    3.2 填报控件方法列表

    获取到控件之后,需要对该控件进行再操作,可以获取其控件值,赋值,设置是否可见等等方法,如下列表:

    方法名方法说明
    取实际值Widget.getValue()获取控件实际值
    取显示值Widget.getText()获取控件的显示值
    赋实际值Widget.setValue()给参数控件赋值,不建议给填报控件赋实际值
    赋显示值Widget.setText()给参数控件赋显示值
    可见Widget.visible()设置控件可见
    不可见Widget.invisible()设置控件不可见
    是否可见Widget.isVisible(boolean)返回控件是否可见,返回 true 可见,false 不可见
    设置可见Widget.setVisible(boolean)设置控件是否可见,参数为 true 可见,false 不可见
    设置可用Widget.setEnable(boolean)设置控件是否可用,参数为 true 可用,false 不可用
    是否可用Widget.isEnabled()返回控件是否可用,返回 true 可用,false 不可用
    调用控件事件Widget.fireEvent("事件名称")设置控件触发指定名字的事件

    其中 Widget 为获取到的控件

    注:如果用 setValue()给下拉树赋值,需要添加一个 false 参数,即 setValue(value,false);value为需要赋给下拉树的值

    提醒:填报页面上最后显示填报入库的值都是单元格的值,通过填报控件编辑数据,当编辑结束之后,控件会自动将值传递给当前单元格,故,如果通过 JavaScript 代码给控件赋值,只有被赋值的控件处于被编辑的状态时,最后才能在单元格中显示出来,如果控件处于非编辑状态,使用控件赋值,是不起作用的,所以,强烈建议用户在获取填报单元格的值或赋值的时候尽量使用 getCellValue 和 setCellValue

    4. 示例链接

    获取填报预览单元格应用请查看 获取填报预览单元格

    给填报单元格赋值请查看 填报控件(单元格)赋值给扩展单元格置数给文本框赋多个值

    JavaScript代码对填报数据进行校验请查看 JS 校验


    索引:

    利用 JS 实现自定义按钮选取文件并上传到数据库

    JS实现标题动态居中

    JS实现悬停放大图片

    JS 复选框求和判断

    用JS 解决控件值刷新不及时的问题

    JS 实现填报中的动态星星评分效果

    JS 获取填报扩展单元格控件的值

    JS 实现报表列宽预览时可拖动

    JS 实现填报同时提交进不同表

    JS 实现改变复选框选中行背景色

    JS 去掉填报校验出错提示框

    鼠标经过单元格背景色(字体)改变,离开后恢复

    JS 实现限制文本框控件文本长度

    自动报警声音实现

    JS 实现关闭子窗口时刷新父窗口

    JS 实现子报表中返回主报表

    批量修改复选框选中行中某列的值

    JS 制作导入进度条

    JS 实现填报时对修改过的单元格进行标识

    JS 实现点击单选按钮组切换sheet

    JS 实现单击控件可直接编辑

    JS 控制鼠标悬浮/离开按钮背景色

    JS 实现改变当前选中单元格的背景色,离开后恢复原色

    JS 实现页面加载后默认显示指定 sheet 页签

    JS 实现改变选中 sheet 字体颜色

    JS 修改报表页面中的提示文字

    JS 设置控件焦点

    JS 初始化按钮颜色,点击后变色

    自动发送消息解决方案

    JS 实现下拉框中当鼠标离开下拉菜单时立即隐藏菜单

    JS 实现改变复选框选中行中指定单元格背景色

    JS 显示即时/实时时间

    JS 实现自由式填报表动态显示/隐藏行

    JS 实现文本控件编辑后根据条件显示样式

    JS 使用填报页面的控件查询

    JS 实现横向宽报表标题始终在页面中间

    JS 实现隐藏行/列

    JS 实现填报分页下复选框全选

    JS 获取扩展控件的所有值

    JS 设置报表主体不可用

    JS 实现分析/填报报表加载后自动滚动到最下方/最右侧

    JS 点击按钮修改单元格的值

    JS隐藏sheet页

    JS 实现插入自定义行数

    JS 控制单选组按钮上下左右居中显示

    JS 获取当前编辑行单元格行号

    JS 实现删除行前先确认

    JS 获取填报预览单元格

    JS 给填报控件(单元格)赋值

    JS 给扩展单元格置数

    JS 给文本框赋多个值

    JS 实现点击单选按钮弹出对话框输入值

    JS 限制复选框(填报)选中个数

    JS 获取复选框选中行的单元格值

    JS 实现复选框控件全选

    JS 获取最后编辑的值

    鼠标滑过下拉框选项时在单元格中显示对应图片

    JS 实现填报校验后返回错误信息

    控件回调事件的返回值

    JS 实现切换 sheet 时隐藏或显示参数面板

    JS 去除填报左上角红色三角

    JS 改变控件编辑时的字体颜色


    附件列表


    主题: 二次开发
    标签: 暂无标签 编辑/添加标签
    如果您认为本文档还有待完善,请编辑

    文档内容仅供参考,如果你需要获取更多帮助,付费/准付费客户请咨询帆软技术支持
    关于技术问题,您还可以前往帆软社区,点击顶部搜索框旁边的提问按钮
    若您还有其他非技术类问题,可以联系帆软传说哥(qq:1745114201

    此页面有帮助吗?只是浏览 [ 去社区提问 ]