内容发布更新时间 : 2024/7/1 19:03:10星期一 下面是文章的全部内容请认真阅读。

1 概述

在现有的业务流程中，经常会遇到同一个表单申请多条记录的情况，由于现有产品表单的局限性，不能动态地添加多条业务记录，因此需要一个可以由用户自行添加记录的控件，方便记录数据。经过多次试验，数据表格控件是一个比较好的解决方案。

图1 数据表格控件设置界面

在数据表格控件中填写脚本函数与表单控件中的脚本函数有几个相同点和不同点

1、相同点：

表格控件中的脚本函数和表单控件中的脚本函数都是javaScript。 2、不同点：

两个表格控件生成的页面不同，表格控件的页面嵌套在表单控件的页面中。

2 属性配置

在表单设计的时候可以通过“嵌套JSP”控件拉出数据表格控件，并可以设置有什么列，设计列的内容和样式。列的设置包括列标识、列名称、数据类型、控制类型等。

2.1 数据类型

类型名称 字符 整型 浮点型 日期

配合日期控件，返回格式”yyyy-MM-dd” 说明 2.2 控件类型

控件名称 文本框 下拉选择 日期控件 文本域 自定义

需要设置备选内容 数据类型必须为日期 可以输入多条记录 说明 2.3 校验方法

只需要在校验方法中填入校验方法名。自己写校验的方法，方法的参数为value,record,colObj,grid，如：校验输入值是否为百分数。

function checkqz(value,record,colObj,grid){ var content = value; var reg = /^(100||[1-9]?\\d?((\\.\\d)?))%$/; if(reg.test(content)){ return true; }else{ return \请输入正确格式,0-100以内数字+%，只保留一位小数\ } }

2.4 渲染方法

可以改变列表的格式，用法类似校验方法。

2.5 备选内容

当控件类型选择的是下拉框时，下拉框的内容由此确定

格式为'控件显示内容1':'下拉显示内容1','控件显示内容2':'下拉显示内容2'。 如：'计薪':'计薪','调休':'调休'

3 脚本开发

3.1 内置事件

3.1.1 afterEdit( value, oldValue, record, col, grid)

对单元格进行修改后，光标离开单元格时触发事件 参数名称 Value OldValue Record Col Grid

类型 Any Any Object or array Object Object 新输入的值 旧值 该操作所在行记录集合对象 该操作所在列对象 表格控件对象 参数说明 3.1.2 beforeEdit( value, record, col, grid)

在对单元格修改之前触发事件 参数名称 Value Record Col Grid 类型 Any Object or array Object Object 参数说明 新输入的值 该操作所在行记录集合对象 该操作所在列对象 表格控件对象