java ztree treegrid_jQuery zTree 展示树形表格

jQuery zTree 展示树形表格

基本测试Demo

标准数据格式

var setting = {

//显示复选框

check: {

enable: true

},

/*

//显示单选框

check: {

enable: true,

chkStyle: "radio",

radioType: "level"

},

*/

};

var zNodes =[

{ name:"父节点1 - 展开", open:true,

children: [

{ name:"父节点11 - 折叠",

children: [

{ name:"叶子节点111"},

{ name:"叶子节点112"},

{ name:"叶子节点113"},

{ name:"叶子节点114"}

]},

{ name:"父节点12 - 折叠",

children: [

{ name:"叶子节点121"},

{ name:"叶子节点122"},

{ name:"叶子节点123"},

{ name:"叶子节点124"}

]},

{ name:"父节点13 - 没有子节点", isParent:true}

]},

{ name:"父节点2 - 折叠",

children: [

{ name:"父节点21 - 展开展开展开展开", open:true, checked:true,

children: [

{ name:"叶子节点211"},

{ name:"叶子节点212"},

{ name:"叶子节点213"},

{ name:"叶子节点214"}

]},

{ name:"父节点22 - 折叠",

children: [

{ name:"叶子节点221"},

{ name:"叶子节点222"},

{ name:"叶子节点223"},

{ name:"叶子节点224"}

]},

{ name:"父节点23 - 折叠",

children: [

{ name:"叶子节点231"},

{ name:"叶子节点232"},

{ name:"叶子节点233"},

{ name:"叶子节点234"}

]}

]},

{ name:"父节点3 - 没有子节点", isParent:true}

];

$(function(){

$.fn.zTree.init($("#treeDemo"), setting, zNodes);

});

显示选择的值

标准数据格式

....省略

权限设置

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

var treeObj = $.fn.zTree.getZTreeObj("treeDemo");

var nodes = treeObj.getCheckedNodes(true);

var v = "";

for(var i=0;i

v += nodes[i].id+"_"+nodes[i].name + ",";

//console.log("节点id:" + nodes[i].id + "节点名称" + v); //获取选中节点的值

}

alert(v);

});