您的位置:首页 > 其它

TreeTable树形数据列表

2016-12-19 09:04 225 查看
    做项目的过程中遇到TreeTable,感觉很焦急,于是我就去github上面找,发现很糟糕。上面需要写的代码太过于多,本人手比较懒,所以几番查找。找到了一个比较实用的TreeTable的js

   

    文件中的default和vsStyle是两种不同的风格

页面引用就是jquery.treeTable.js就可以了,那么怎么实现树形列表呢?当然数据就需要是json格式

var request = JSON.stringify(paramsModel);
request = escape(encodeURIComponent(request));
var url=baseUrl+"rest/xx/"+request+"/"+key+".json";
console.log(url);
$.ajax({
type: "get",
url: url, //Servlet请求地址
dataType: 'json',
cache: false,
async: false,
success: function (data) {
//eval将字符串转成对象数组
data=eval(data);
var showContent = ""; //添加内容变量
if(data!=null){
var con = data.rows;//获取json中的list列表
console.log(con);
if(con.length>0){
for (var i = 0; i < con.length; i++) {
var a = con[i];
if (a.fid == a.departId) { //判断是否是一级节点
showContent += "";

} else {
showContent += "";

}
}
}
}
$("#treeTable").append(showContent);
//以下为初始化表格样式
var option = {
theme: 'vsStyle',
expandLevel: 2,
};
$('#treeTable').treeTable(option);
console.info("内容已经加载并初始化");
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert(errorThrown);
console.log("数据请求异常 请查看控制台错误 或者检查url配置");
}
});其中里面的theme就是不同风格对应的文件夹
那么后台的数据就需要对应成json格式

这里推荐一个处理递归数组的Java文件

public class ProjectConstructeTreeList {
private List<BimProjectConstruction> resultNodes = new ArrayList<BimProjectConstruction>();//树形结构排序之后list内容
private List<BimProjectConstruction> nodes; //传入list参数

public ProjectConstructeTreeList(List<BimProjectConstruction> nodes) {//通过构造函数初始化
this.nodes = nodes;
}

/**
* 构建树形结构list
* @return 返回树形结构List列表
*/
public List<BimProjectConstruction> buildTree() {
for (BimProjectConstruction node : nodes) {
if (node.getFid().equals(node.getDepartId())) {//通过循环一级节点 就可以通过递归获取二级以下节点
resultNodes.add(node);//添加一级节点
build(node);//递归获取二级、三级、。。。节点
}
}
return resultNodes;
}
/**
* 递归循环子节点
*
* @param node 当前节点
*/
private void build(BimProjectConstruction node) {
List<BimProjectConstruction> children = getChildren(node);
if (!children.isEmpty()) {//如果存在子节点
for (BimProjectConstruction child : children) {//将子节点遍历加入返回值中
resultNodes.add(child);
build(child);
}
}
}
/**
* @param node
* @return 返回
*/
private List<BimProjectConstruction> getChildren(BimProjectConstruction node) {
List<BimProjectConstruction> children = new ArrayList<BimProjectConstruction>();
for (BimProjectConstruction child : nodes) {
if (node.getId().equals(child.getFid())) {//如果id等于父id
children.add(child);//将该节点加入循环列表中
}
}
return children;
}

}调用方式:
ProjectConstructeTreeList tree = new ProjectConstructeTreeList(ConstructionList);
List<BimProjectConstruction> listTree=tree.buildTree();
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息