我们在项目中经常会需要用到树,这次按照数据库存储的特点重新了做一个小demo,使用zTree来实现这个功能。
简单实例:
首先我们需要在界面中引入代码,很简单,但是很重要,它用来存放加载的树。
ps:添加ztree的引用,下载地址:http://www.ztree.me/v3/main.php#_zTreeInfo
<span style="font-family:KaiTi_GB2312;font-size:18px;"><ul id="tree" class="ztree"></ul> </span>
其次是js代码:
<span style="font-family:KaiTi_GB2312;font-size:18px;"> var tree = {
/**
* 所有的初始化的操作
*/
pFunction: {
zTree: '',
setting:
{
view: {
dblClickExpand: false,
showLine: true, //是否显示节点间的连线
selectedMulti: false,
expandSpeed: "fast"
},
callback: {
onDblClick: zTreeOnDblClick
},
check: {
enable: true,
chkStyle: "radio",
radioType: "all"
},
data:
{
key:
{
name: "Name" //界面显示的名称参数
},
simpleData:
{
enable: true,
idKey: "ID",
pIdKey: "PID",
rootPId: "null"
}
}
},
//加载树的资源
loadTree: function () {
$.post("/HomeIndex/Ztree", null, function (resourceInfo) {