easyui之控件Tree

   恩，上一篇关键说我用的是什么版本的easyui了。。其实我用的是1.3.5的easyu版本。

  

 这篇文章先介绍tree的两种用法，一种是一次性取完，一种是异步加载。

   取完的代码如下：

<ul id="tt" class="easyui-tree" data-options="url:url,method:'get',animate:true,lines:true ">
</ul>

这个是一次性取完的

[{
"id":1,
"text":"My Documents",
"children":[{
"id":11,
"text":"Photos",
"state":"closed",
"children":[{
"id":111,
"text":"Friend"
},{
"id":112,
"text":"Wife"
},{
"id":113,
"text":"Company"
}]
},{
"id":12,
"text":"Program Files",
"children":[{
"id":121,
"text":"Intel"
},{
"id":123,
"text":"123"
},{
"id":124,
"text":"Games",
}]
},{
"id":13,
"text":"index.html"
},{
"id":14,
"text":"about.html"
},{
"id":15,
"text":"welcome.html"
}]
}]

返回的是json格式。

下面是异步加载，只加载第一级的数据。

<ul id="tt" class="easyui-tree" data-options="url:url,method:'get',animate:true,lines:true ">

</ul>

其实你也发现了，这2个方法的调用数据都是一样的，为什么会出现一个异步一个一次性呢，因为tree这个控件已经封装了异步加载的方法。

上面的json已经告诉tree的下面有子级，不需要去异步了。而下面的json格式是这样的，

//后台的方法

 public ActionResult url(string id)
        {

 这里的Id你可以判断是否有值，没有取出第一级菜单栏，有的话就直接获取子级。格式如下：

}

//

[{
"id":1,
"text":"下一级",
"state":"closed" //关键是这句话，如果有子级，那么就加上这句话，代表下一级的下面有子级，那么他会自动根据路径去读取子级，。也就是上面我要你做的判断是否有id。

}]