easyui中的treegrid如何使用？

Question

标准的json数据格式：
每个属性里都可以套用children属性，而children又可以继续写属性，就这样确定父子关系。其实你不看他的数据模型，自己想想，要形成树形结构，最简单的就是 id,pid, 这种方式，类似ztree的数据绑定方式。
不过treegrid来的更直接，直接嵌套children数组。

Answer 1

TreeViewGrid
树形表格
继承$.fn.datagrid.defaults，使用$.fn.treegrid.defaults重载默认值。依赖关系
数据表格
使用方法<table id="tt"></table>  
<table id="tt"></table>$('#tt').treegrid({   
    url:'treegrid_data.json',   
    treeField:'name',   
    columns:[[   
        {title:'Task Name',field:'name',width:180},   
        {field:'persons',title:'Persons',width:60,align:'right'},   
        {field:'begin',title:'Begin Date',width:80},   
        {field:'end',title:'End Date',width:80}   
    ]]   
});  
$('#tt').treegrid({ url:'treegrid_data.json', treeField:'name', columns:[[ {title:'Task Name',field:'name',width:180}, {field:'persons',title:'Persons',width:60,align:'right'}, {field:'begin',title:'Begin Date',width:80}, {field:'end',title:'End Date',width:80} ]] });
属性
属性继承数据表格，以下是树形表格独有的树形。名称 类型 描述 默认值
treeField（树形字段） string（字符串） 定义作为树节点的字段。 null
animate（动画） boolean（布尔型） 定义当打开或关闭节点时是否显示动画效果。 false
事件
事件继承数据表格，以下是树形表格的独有事件。名称 参数 描述
onClickRow row 当用户点击节点时触发 。
onDblClickRow row 当用户双击节点时触发 。
onBeforeLoad row, param 在请求载入数据之前触发，返回false将取消载入。
onLoadSuccess row, data 当数据载入成功时触发。
onLoadError arguments 当数据载入失败时触发，arguments参数和jQuery.ajax的'error'函数一样。
onBeforeExpand row 在节点打开之前触发 ，返回false将取消打开。
onExpand row 当节点打开时触发。
onBeforeCollapse row 在节点关闭之前触发，返回false将取消关闭。
onCollapse row 当节点关闭时触发。
onContextMenu e, row 当节点被鼠标右键点击时触发 。
onBeforeEdit row 当用户开始编辑节点时触发。
onAfterEdit row,changes 当用户结束编辑时触发。
onCancelEdit row 当用户取消编辑节点时触发。
方法
名称 参数 描述
options none 返回树形表格的属性对象。
resize options 设置树形表格的大小，options包含2个属性：
width：新的树形表格宽度
height：新的树形表格高度。
fixRowHeight id 固定特定行的高。
loadData data 载入树形表格数据。
reload id 重新载入树形表格数据。
reloadFooter footer 重新载入树形表格的行底数据。
getData none 获取已载入的数据。
getFooterRows none 获取行底数据。
getRoot none 获取根节点，返回节点对象。
getRoots none 获取根节点，返回节点数组。
getParent id 获取父节点。
getChildren id 获取子节点。
getSelected none 获取被选择节点并返回，如果没有节点被选择则返回null。
getSelections none 获取所有被选择的节点。
getLevel id 获取指定的节点的层级。
find id 查找指定的节点并返回节点数据。
select id 选择一个节点。
unselect id 取消选择一个节点。
selectAll none 选择所有的节点。
unselectAll none 取消选择所有的节点。
collapse id 关闭节点。
expand id 打开节点。
collapseAll id 关闭所有节点。
expandAll id 打开所有节点。
expandTo id 打开从根节点到指定节点直接的所有节点。
toggle id 打开或关闭节点的触发器。
append param 添加若干子节点到一个父节点，'param'参数包含如下属性：
parent：DOM对象，将要被添加子节点的父节点，如果未指定，子节点将被添加至根节点。
data：数组，节点数据。
remove id 移除一个节点和它的子节点。
refresh id 属性指定的节点。
beginEdit id 开始编辑节点。
endEdit id 结束编辑节点。
cancelEdit id 取消编辑节点。
getEditors id 获取指定行的编辑器，每个编辑器都有如下属性：
actions：编辑器可以做的行为。
target：目标编辑器jQuery对象。
field：字段名。
type：编辑类型。
getEditor options 获取指定的编辑器，options包含2个属性：
id：行节点 id。
field：字段名。

Answer 2

自己拼接字符串：  public string GetString(IList<Navigation> list)
        {
            StringBuilder sb = new StringBuilder();            //获取父级菜单
            IList<Navigation> parent = (from p in list
                                        where p.ParentId == 0                                        select p).ToList<Navigation>();
            sb.Append("{\"total\":" + list.Count + ", \"rows\":[");
            foreach (var item in parent)
            {
                IList<Navigation> child = (from p in list
                                           where p.ParentId == item.Id
                                           select p).ToList<Navigation>();                sb.Append("{\"MenuId\":\"" + item.Id + "\",\"MenuName\":\"" + item.MenuName + "\",\"group\":\""
                            + item.MenuName + "\",\"ParentId\":\"" + item.ParentId + "\",\"LinkAddress\":\"" + item.LinkAddress
                            + "\",\"IsShow\":\"" + item.IsShow + "\",\"Sort\":\""
                            + item.Sort + "\",\"Icon\":\"" + item.Icon + "\",\"state\":\"closed\",");                sb.Append("\"children\":[");                foreach (var menu in child)
                {
                    sb.Append("{\"MenuId\":\"" + menu.Id + "\",\"MenuName\":\"" + menu.MenuName + "\",\"group\":\""
                            + menu.MenuName + "\",\"ParentId\":\"" + menu.ParentId + "\",\"LinkAddress\":\"" + menu.LinkAddress
                            + "\",\"IsShow\":\"" + menu.IsShow + "\",\"Sort\":\""
                            + menu.Sort + "\",\"Icon\":\"" + menu.Icon + "\"},");
                }
                sb.Remove(sb.Length - 1, 1);
                sb.Append("]},");
            }
            sb.Remove(sb.Length - 1, 1);
            sb.Append("]}");            return sb.ToString();
        }