Ext.require([
'Ext.tree.*',
'Ext.data.*'
]);
Ext.onReady(function () {
var store = Ext.create('Ext.data.TreeStore', {
proxy: {
type: 'ajax',
url: '/Home/LoadTree'
},
root: {
expanded: true,
text: "root",
user: "",
status: "",
id: "0"
}
});
var tree = Ext.create('Ext.tree.Panel', {
title: 'Simple Tree',
200,
autoHeight: true,
store: store,
rootVisible: false,
renderTo: Ext.getBody()
});
//用于选中某一项时实现跳转
tree.on("itemclick", function (view, record, item, index, e) {
//选中叶子节点时才跳转,可根据需求而定
if (record.raw.leaf)
location.href = "Index.aspx?id=" + record.raw.id;
});
//后台处理
[HttpGet]
public void LoadTree()
{
int node = 0;
// 一次性加载所有数据
var list = from item in dc.Member where item.Father == node select item;
sb.Append("[");
if (list != null && list.Count() > 0)
{
//也可添加href:'链接'来实现跳转
foreach (Models.Member item in list)
{
sb.Append( ",{ text : '" + item.MemberName + "',id : " + item.MemberId);
GetTree(item.MemberId);
sb.Append(" } ");
}
}
sb.Append("]");
sb = sb.Replace("[,", "[");
Response.Write(sb);
Response.End();
}
public void GetTree(int id)
{
var list = from item in dc.Member where item.Father == id select item;
if(list == null || list.Count() <=0 )
{
sb.Append(", leaf : true");
return;
}
sb.Append(", expanded : true, children : [");
foreach (Models.Member item in list)
{
sb.Append(",{ text : '" + item.MemberName + "', id : " + item.MemberId);
GetTree(item.MemberId);
sb.Append(" } ");
}
sb.Append("]");
}
最终效果为: