This article mainly introduces the five steps to easily implement the use of zTree. It has certain reference value. Interested friends can refer to it. I hope it can help everyone.
1. Import the zTree configuration file
<script type="text/javascript" src="../js/ztree/jquery.ztree.all-3.5.js"></script> <link rel="stylesheet" href="../js/ztree/zTreeStyle.css" />
2. Set class="ztree"
## in the required location
#
<p data-options="title:'基础菜单'"> <ul id="baseMenu" class="ztree"></ul> </p>
# in the function after the page is loaded.
##
var setting = { data: { simpleData: { enable: true //支持json格式 } },
var zNodes = [ //驼峰式命名pId {id:1,pId:0,name:"父节点1"}, {id:2,pId:0,name:"父节点2"}, {id:11,pId:1,name:"父1子节点1"}, {id:12,pId:1,name:"父1子节点2"}, ];
$.fn.zTree.init($("#baseMenu"), setting, zNodes);
The above is the detailed content of Five steps to easily implement zTree usage examples. For more information, please follow other related articles on the PHP Chinese website!