zTree 异步加载

zTree异步加载数据的简单实现，更为详细的Api请参考 zTree官网   http://www.treejs.cn/

 1 <link href="~/Content/ztree/css/zTreeStyle.css" rel="stylesheet" />
 2 <script src="~/Content/ztree/js/jquery-1.4.4.min.js"></script>
 3 <script src="~/Content/ztree/js/jquery.ztree.core.js"></script>
 4 
 5 <script type="text/javascript">
 6     var setting = {
 7         async: {
 8             enable: true,
 9             url: "/ZTree/LoadTree",//异步加载时的请求地址
10             autoParam: ["id"],//提交参数
11             type: 'get',
12             dataType: 'json'
13         },
14         checkable: true,
15         showIcon: true,
16         showLine: true,
17         data: {
18             simpleData: {
19                 enable: true
20             }
21         },
22         expandSpeed: "",
23         callback: {
24             onClick: zTreeOnClick
25         }
26     };
27 
28     $(document).ready(function () {
29         $.ajax({
30             url: '/ZTree/LoadTree',
31             type: 'get',
32             dataType: 'json',
33             success: function (data) {
34                 $.fn.zTree.init($("#treeDemo"), setting, data);
35             }
36         });
37     });
38 
39     //单击时获取zTree节点的Id,和value的值
40     function zTreeOnClick(event, treeId, treeNode, clickFlag) {
41         var treeValue = treeNode.id + "," + treeNode.name;
42         //alert(treeNode.id + "," + treeNode.name);
43     };
44 </script>
45 
46 <div>
47     <ul id="treeDemo" class="ztree"></ul>
48 </div>

 

 1 public class ZTreeController : Controller
 2 {
 3         //测试数据
 4         List<TreeModel> list = new List<TreeModel>
 5         {
 6             new TreeModel { Id = 1, PId= 0, Name = "第一级 1", IsParent = true },
 7             new TreeModel { Id = 2, PId= 1, Name = "第二级 1", IsParent = true },
 8             new TreeModel { Id = 3, PId= 2, Name = "第三级 1", IsParent = false },
 9             new TreeModel { Id = 4, PId= 0, Name = "第一级 2", IsParent = true },
10             new TreeModel { Id = 5, PId= 4, Name = "第二级 2", IsParent = true },
11             new TreeModel { Id = 6, PId= 5, Name = "第三级 2", IsParent = true },
12             new TreeModel { Id = 7, PId= 6, Name = "第四级 2", IsParent = true },
13             new TreeModel { Id = 8, PId= 7, Name = "第五级 2", IsParent = false }
14         };
15 
16         public ActionResult Index()
17         {
18             return View();
19         }
20 
21         public string LoadTree(int id = 0)
22         {
23             List<TreeModel> listView = list.Where(p => p.PId == id).ToList();
24             
25             var jsonSerializerSettings = new JsonSerializerSettings
26             {
27                 ContractResolver = new CamelCasePropertyNamesContractResolver()
28             };
29             return JsonConvert.SerializeObject(listView, Formatting.None, jsonSerializerSettings);
30         }
31 
32 }

 

posted @ 2016-07-31 22:21  zlen  阅读(8579)  评论(0)    收藏  举报