<script src="~/Scripts/ztree/js/jquery-1.4.4.min.js"></script>
<script src="~/Scripts/ztree/js/jquery.ztree.core-3.5.js"></script>
<title>Index</title>
<script type="text/javascript">
////异步加载节点
var setting = {
async: {
enable: true,
url: "/Home/ZtreeData",//数据请求地址
autoParam: ["id", "name", "pId","level=lv"],//像后台请求数据时的参数
otherParam: { "otherParam": "zTreeAsyncTest" },
dataFilter: filter
},
callback: {
onclick: nodeClick
}
};
function nodeClick(event, treeId, treeNode, clickFlag)
{
//节点点击事件
}
function filter(treeId, parentNode, childNodes) {
if (!childNodes) return null;
for (var i = 0, l = childNodes.length; i < l; i++) {
childNodes[i].name = childNodes[i].name.replace(/\.n/g, '.');
}
return childNodes;
}
$(document).ready(function () {
$.fn.zTree.init($("#treeDemo"), setting);
});
</script>
<div> <ul id="treeDemo" class="ztree"></ul> </div>
后台采用asp.net mvc动态数据:
public ActionResult ZtreeData(string lv,string id="0",string pId = "0")
{
Sql2012TestEntities db = new Sql2012TestEntities();
return Json(db.TreeTable.Select(t => new
{
id = t.ID,
pId = t.PID,
name = t.Name,
t = t.Name,
click = true,//是否可以点击
isParent = db.TreeTable.Any(a=>a.PID==t.ID)//判断是否为父节点
}).Where(t => t.pId == id), JsonRequestBehavior.AllowGet);
}