listTable组件在创建时“默认展开”的设置是勾选上的,就是默认展开所有的子数据

控制每次只显示一个从表的数据可以把“默认展开”勾选去掉,点击哪个主数据再显示对应的子数据
具体设置如下:
1.在主data上定义一个计算关系,如名字是rowVisible

2.在listTable生成的节点中找有hide样式的tr,bind-visible上设置val(“rowVisible”)==’true’
并且自定义一个属性bind-attr-title值设置为主data的主键值(bizData中的概念别名就是主键)

3.定义一个空的class
Model.prototype.tr2Click = function(event) {
var $oldRow = $(this.getElementByXid("listTable1")).find(".rowVisible");//获取有自定义rowVisible样式tr
var $e = $(event.currentTarget); //获取当前点击的tr
//判断展开主没有点击收缩直接切换到其他行时设置为收缩状态
if($oldRow.length>0){
for(var i = 0;i<$oldRow.length;i++){
if($oldRow[i].title !=$e.next()[0].title && !$oldRow.hasClass("hide")){
$oldRow.removeClass("rowVisible");
$oldRow.addClass('hide');
}
}
}
//控制展开或收缩
$('>td>i.x-expand-i', $e).toggleClass('');
$e.next().toggleClass('hide');
$e.next().addClass("rowVisible");
//跟计算关系rowVisible赋值,控制bind-visible
var data = this.comp("bizData1");
var row = event.bindingContext.$object;
var rowID = event.bindingContext.$object.getID();
if(!$e.next().hasClass('hide')) {
data.each(function(param) {
if (param.row.getID() == rowID) {
param.row.val("rowVisible", "true");
} else
param.row.val("rowVisible", "false");
})
}
};

评一波