MVC4 +EasyUI 使用TreeGrid 方法

用easyui已经有2年了，换了新环境，要求用mvc开发，所以想把原来的项目直接用mvc重构。

在使用TreeGird的时候出现了问题，发现在转换为treegrid的json 很费劲，一直都是用的easyui 的手动转换类。

突然用mvc 又不想使用json数据拼接的方式，就这样纠结了2天。

今天无意中重新看了一边easyui treegrid的demo，发现原来easyui 早就提供了另外一种解决方案。恍然大悟。

 <script type="text/javascript">
                    $(function () {
                        $('#tg').treegrid({
                            title: '菜单导航',
                            iconCls: 'icon-ok',
                            url: '/Admin/power/GetList',
                            width: 700,
                            height: 250,
                            method: 'get',
                            rownumbers: true,
                            idField: 'NavCode',
                            treeField: 'NavName',
                            columns: [[
                                { field: 'NavName', title: 'Persons', width: 150 },
                                { field: 'NavCode', title: 'Task Name', width: 180 },
                                { field: 'iconCls', title: 'Begin Date', width: 80 }
                            ]]
                        });
                    })
                </script>
                <table id="tg"></table>

 1   public ActionResult GetList()
 2         {
 3             List<power_Nav> list = db.power_Nav.ToList().OrderByDescending(m => m.NavCode).ToList();
 4             List<object> result = new List<object>(); 
 5             foreach (power_Nav nav in list)
 6             {
 7                 if (nav.ParentCode.Equals("0"))
 8                 {
 9                     result.Add(new { NavCode = nav.NavCode, NavName = nav.NavName,iconCls=nav.iconCls });
10                 }
11                 else
12                 {
13                     result.Add(new { NavCode = nav.NavCode, NavName = nav.NavName, iconCls = nav.iconCls, _parentId = nav.ParentCode });
14                 }
15             }
16             var json = new
17             {
18                 total = list.Count,
19                 rows = result
20             };
21             return Json(json, JsonRequestBehavior.AllowGet);
22 
23         }

最后附上效果图

MVC4 +EasyUI 使用TreeGrid 方法

MVC4 +EasyUI 使用TreeGrid 方法

相关推荐