html结构转json插件,json树状数据转表格插件

特效描述：树状数据转表格。jQuery树状数据转表格插件

代码结构

1. 引入CSS

2. 引入JS

3. HTML代码

---

预览

//数据

var data={

singletree:[

{

"title": "编码",

"field": "code",

"candidate": false

},

{

"title": "名称",

"field": "name",

"candidate": true

},

{

"title": "年龄",

"field": "age",

"candidate": true

},

{

"title": "性别",

"field": "sex",

"candidate": true

}],

doubletree:[

{

"title": "编码",

"field": "code",

"candidate": false

},

{

"title": "基本信息",

"open": true,

"children": [

{

"title": "名称",

"field": "name",

"candidate": true

},

{

"title": "年龄",

"field": "age",

"candidate": true

},

{

"title": "性别",

"field": "sex",

"candidate": true

}

]

},

{

"title": "工作信息",

"open": true,

"children": [

{

"title": "职位",

"field": "office",

"candidate": true

},

{

"title": "职称",

"field": "call",

"candidate": true

},

{

"title": "所在楼层",

"field": "place",

"candidate": true

}

]

}],

threetree:[

{

"title": "编码",

"field": "code",

"candidate": false

},

{

"title": "基本信息",

"open": true,

"children": [

{

"title": "名称",

"field": "name",

"candidate": true

},

{

"title": "年龄",

"field": "age",

"candidate": true

},

{

"title": "性别",

"field": "sex",

"candidate": true

},

{

"title": "教育相关",

"open": true,

"children": [

{

"title": "最高学历",

"field": "education",

"candidate": true

},

{

"title": "毕业学校",

"field": "college",

"candidate": true

}

]

}

]

},

{

"title": "工作信息",

"open": true,

"children": [

{

"title": "职位",

"field": "office",

"candidate": true

},

{

"title": "职称",

"field": "call",

"candidate": true

},

{

"title": "所在楼层",

"field": "place",

"candidate": true

}

]

}]

};

//表格树初始化

TreeTable.init(data.threetree,$("#old"),{

previewTargets:["#preview"]

});

//设置按钮

$("#set").click(function(){

var selectValue="";

$("#preview").find("span").each(function(){

var _this=$(this);

if(_this.attr("field")!=null&&_this.attr("field")!=="code"){

selectValue+='"'+_this.attr("field")+'",';

};

});

if(selectValue.length!=0){

selectValue="["+selectValue.substring(0,selectValue.length-1)+"]";

}

$("#value").val(selectValue);

});