图1
在listTable创建时设置里层的list时要设置关联的data通过哪个关系给外层的list的关联的data形成主从
listTable创建时有设置“默认展开”和“展开图标”的设置,“默认展开”是控制里层的list默认是否展开显示状态如图1的展现,“展开图标”是点击外层list隐藏里层list时外层list的序号列前会显示图标,下面的案例中选择的的是icon-arrow-right-b
![]()
需要注意的是,如果在两个data设置了主从关系,那么默认只有第一条主数据会显示子,下面的都不会显示
listTable的默认实现时在外层的list上点击时会控制里面的list是否显示,并在外层list的序号前显示一个icon-arrow-right-b格式的图标,当里层的list没有数据时会显示标题和箭头图标,如下:
如果要控制里层的list没有数据是不显示标题和图标,可以如下控制:
1.控制标题不显示:定义一个js函数
Model.prototype.rowVisible = function(event) {
var rowid = event.getID();
var cData2 = this.comp("bizData2");//里层嵌套list关联的data
var rows = cData2.find([ "fZB" ], [ rowid ]);//通过外层rowid查找里层的data上是否有相关的子数据
if (rows.length > 0) {
return true;
}
else
return false;
}
在外层list下生成的两个tr的第二个tr上设置bind-visible调用这个函数,如下图

2.控制图标不显示,修改如下图第一个tr上bind-click,直接到js代码中如下实现:
Model.prototype.tr7Click = function(event) {
var $e = $(event.currentTarget);
var rowid = event.bindingContext.$object.getID();
var cData = this.comp("bizData2");//里层嵌套list关联的data
var rows = cData.find([ "fZB" ], [ rowid ]);//通过外层rowid查找里层的data上是否有相关的子数据
if (rows.length > 0) {
$('>td>i.x-expand-i', $e).toggleClass('icon-arrow-right-b');
}
$e.next().toggleClass('hide');
};




评一波