容器表是用来排布web组件的，数据表顾名思义就是用来输入输出数据的。数据表可以细分为三种：
- 条件查询、分页显示的查询表
- 可以录入表格型数据的录入表
- 用来显示表格型数据的显示表
这些都是数据表，只是属性不同：
- 查询表是设置了：bind=tableTotalCount和pagination=true
- 录入表是设置了：newRow=true
- 显示表是这三个属性都不设置
注1：查询表的显示已经纳入了jxWebUI的内置工作流，所以不需要设置表名；录入表和显示表因为需要开发者自行操作表数据，所以必须设置表名
注2：录入表也能显示数据，比如，一个订单做到一半要外出，先保存起来，等回来后继续录入，则需要先将之前的录入内容显示回来
定义格式
数据表的定义格式为：
t = page.dataTable(表名).compute('联动计算表达式1').compute('联动计算表达式2').属性1(属性1值).属性2(属性2值)...
注：compute的说明情参考：前端联动计算。不需要联动计算则忽略
数据表需要定义列，数据表的数据是一个json数组，数组中的每一个元素都是一个【列名:列值】键值对组成的dict，顺序对应了表中的一行。每一行数据在显示时，根据列名将列值显示到对应的列中。
数据表定义示例：
t = page.dataTable().width(900).title('查询结果').bind('tableTotalCount').pagination(True)
t.col('devID').head('devID').width(200).hide(True)
t.col('devType').head('设备类型').width(200)
t.col('devName').head('设备名称').width(200)
t.col('op').head('操作').width(200).a().capaname('test.query_device').motion('disp').demand('disp_dev').text('查看设备').ignoreCapaid(True).primary(True).require(['devID','devName'])
显示效果就是下图中的【查询结果】。
查询结果定义了四列，对的，你没看错我也没说错，确实是四列，只不过devID这一列定义了一个hide=true的属性，所以它就隐藏不见了。
为什么不让用户看还要定义呢？因为它是ID，这一行的最后有一个type a的工具条【查看数据】，点不同行的查看数据，肯定想查看的是本行的设备数据。所以这时就需要同时给出这一行的设备ID，但这个数据用户看了没啥用，所以要隐藏起来
数据表数据结构
数据表所显示的表数据是一个json数组，数组中的每一个元素都是一个【列名:列值】键值对组成的dict，顺序对应了表中的一行。形如：
[
#行0的数据：
{'第1列列名':'123','第2列列名':'路由器','第3列列名':'路由器1', ...},
#行1的数据：
{'第1列列名':'124','第2列列名':'交换机','第3列列名':'交换机1', ...},
#行2的数据：
{'第1列列名':'125','第2列列名':'交换机','第3列列名':'交换机2', ...},
......
]
数据表属性
bind
类型：string
缺省值：
查询数据时，数据表必须设置bind属性为：tableTotalCount。这是分页查询所必须的，否则无法正常初始化分页的页码。不是永远条件查询、分页显示的数据表不需要设置。
title
类型：string
缺省值：
表的标题。
header
类型：bool
缺省值：true
是否显示表头。表头包括：标题【左侧】、添加新行的按钮【右侧】。
width
类型：int
缺省值：
表的宽度。表宽是绝对宽度，单位像素。
pagination
类型：bool
缺省值：false
pagination=true是给数据表添加分页控件。
添加了分页控件的表就是条件查询分页显示的查询表。jxWebUI接管了search、reSearch两个事件完成了自动化的查询工作流。详见数据表与数控库的访问一章。
newRow
类型：bool
缺省值：false
是否在表头最右侧显示一个白色的十字，点击该十字就会在表中添加一行供用户输入表数据。请注意下图数据表表头最右侧的白色十字：
点击这个白色的十字，就会出现一行空白的输入框，供用户输入表数据。
列属性
容器表需要定义行，然后在行中添加各种web组件。数据表则需要定义列，通过定义列来控制数据的显示。
列的定义格式为：
t.col('列名').属性1(属性1值).属性2(属性2值)...
列名是必须的，表数据每行的同名数据将显示到该列中。
head
类型：string
缺省值：
本列的列标题。也就是本列数据的中文名这样的语义
hide
类型：bool
缺省值：false
是否显示本列
a
类型：无
缺省值：无
指示本列是操作列。
注：设置了a属性后，其它属性等同于工具条。未设置a属性的，其它属性只有：text、width
联动运算
数据表的联动计算定义格式如下：
compute("列名 = 列名 (+|-|*|/ [列名|数值])+")
可以定义多个联动计算。详细说明请参考前端联动计算一章。
注：联动计算不能循环，即不能在计算表达式中直接或间接引用自己，也就是说，某列不能经过代入后在计算式中引用自己。
额外说明
1、你应该已经看出来了，容器表和数据表实质上就是同一个表控件。jxWebUI中进行区分的目的很简单：专用。
- 容器表，用来放置其它控件进行行列对齐
- 数据表，用来录入、显示表格型数据
数据表又可以细分为：
- 条件查询、分页显示的查询表，设置了：bind=tableTotalCount和pagination=true
- 可以录入表格型数据的录入表，设置了：newRow=true
- 用来显示表格型数据的显示表，这三个属性都不设置
2、行计算只能用在录入表中
3、每行的工具条只能用在查询表中
4、录入表的数据是整表读取【capaInstance.getInput(表名)】、整表输出【capaInstance.set_output_datatable(表名,行数据数组)】
示例
#编程方式在capa中定义一个名为test_compute的page
@capa.web
def test_compute(page):
#定义一个名为table2的数据表，标题是数据表，宽900像素，可以添加新行，有一个行计算式：ItemSum=itemPrice*ItemNumber
t = page.dataTable('table2').title('数据表').width(900).newRow(True).compute('ItemSum=itemPrice*ItemNumber')
#定义了三行
t.col('itemPrice').head('单价').width(200)
t.col('ItemNumber').head('数量').width(200)
t.col('ItemSum').head('小计').width(200)
#如果定义了disp修饰的同名函数，则在显示page时，会调用本函数来执行页面初始化工作
@capa.disp
def test_compute(ci, db, ctx):
#定义了list，其每个元素都是一个dict，这个dict对应了数据表中的一行
#dict中的每个元素则是以数据表的各列名为key，其值将显示到对应的列中
rs = []
for v in _data.values():
rs.append({'itemPrice':v.get('price'), 'ItemNumber':v.get('number'), 'ItemSum':v.get('sum')})
#设置好数据后，将其输出到table2表中
ci.set_output_datatable('table2', rs)