Ext.Net动态构建树-TreePanel使用详解
构建TeePanel有很多种方式，也是这几天研究的成果：
1.通过TreeSote动态构建树。两种思想去创建，但有一种方式存在找不到treeSote。
2.通过Node动态构建树。
第一种：构建静态树:
这是可行的一种方式：
1.先在页面上构建TreeStore，用OnReadData事件来加载
<ext:TreeStore ID="TreeStore1" runat="server" OnReadData="GetExamplesNodes" >
<Proxy>
<ext:PageProxy>
<RequestConfig Method="GET" Type="Load" />
</ext:PageProxy>
</Proxy>
<Root>
<ext:Node NodeID="Root" Expanded="true" />
</Root>
</ext:TreeStore>
2.在页面上创建TreePanel用来显示TreeStore。
<ext:TreePanel
runat="server"
Title="TreePanel"
Width="300"
Height="200"
Margin="10"
RootVisible="false"
Lines="false"
UseArrows="true"
StoreID="TreeStore1" />
另一种，创建思想是页面的我就什么TreePanel与TreeStore都不要了，直接都从代码创建，如下：
1.代码创建TreeStore对象。
TreeStore treeStore = new TreeStore()
{
ID = "treeStore" + entity.Id.ToString()
,
Proxy = {
new PageProxy(){
RequestConfig = {
Method = HttpMethod.GET,
Type = DirectEventType.Load
}
}
}
,
Root = {
new Node(){
NodeID = "Root",
Expanded = true
}
}
};
//this.ResourceManager1.AllUpdatePanels.Add(treeStore);
//treeStore.ReadData += new TreeStoreBase.ReadDataEventHandler(GetExamplesNodes);
2.创建TreePanel
TreePanel treePanel = new TreePanel()
{
ID = "treePanel" + entity.Id.ToString(),
Header = false,
AutoScroll = true,
Lines = false,
UseArrows = true,
CollapseFirst = false,
RootVisible = false,
Animate = false,
Border = false
//Store = {
// treeStore
//},
,
Listeners =
{
ItemClick = { Handler = "onTreeItemClick(record, e);" },
AfterRender = { Handler = "onTreeAfterRender" }
}
};
treePanel.Store.Add(treeStore);
3.创建一个Panel来显示。
Panel p = new Panel()
{
ID = "p" + entity.Id.ToString(),
Title = entity.FullName + "-功能菜单树",
Border = false,
BodyStyle = "padding:6px;",
Icon = Icon.User,
//Items = {
//}
};
p.Items.Add(treePanel);
WestPanel.Items.Add(p);//增加到页面显示
思路没有错吧，可写了这么多代码居然报错，说什么treeStroe...找不到。not found
这可把我气坏了，想了一晚上也没想出来结果，后来转变了一个思路，又查API。
可能TreeStroe必须得在页面创建，不允许动态创建，这是我查找的结果如果有人能创建希望留言留下您宝贵的实现方式。
到最后终于找到了另一种实现方法如下：
第二种:通过Node动态构建树方法实现，从我个从角度推荐此方法：
1.创建根目录
Node root = new Node() { NodeID = entity.Id.ToString() };
LoadModules(root);
root.AllowDrag = false;
root.Expanded = true;
//treePanel.Root.Add(root);
2.直接把创建的TreePanel加入到页面控件显示。
WestPanel.Items.Add(new Panel()
{
ID = "pNavigation" + entity.Id.ToString(),
Title = entity.FullName + "功能菜单树",
Border = false,
BodyStyle = "padding:6px;",
Icon = Icon.User,
AutoScroll = true,
Items = {
new TreePanel() {//属性配置
ID="treePanel"+ entity.Id.ToString(),
Header = false,
AutoScroll = true,
Border = false,
Lines = false,
UseArrows = true,
CollapseFirst = false,
RootVisible = false,Animate = false,
Root = {
root
}
,
//Store = {
// treeStore
//},
Listeners={//注册事件
ItemClick={ Handler="onTreeItemClick(record, e);" },
AfterRender={ Handler="onTreeAfterRender"}
}
}
}
});
上面的各种方法我可是花费了我的时间、精力实验出来决定好用的方式了，在这里记录一下，以后如果哪里忘了过来瞧瞧。
如果早能找到上面代码，我就不用花这么长时间研究了，TreePanel网上的资料不多也不太全。
下面是我用于做记录的代码：就是上面动态生成的代码结构:
//<ext:Panel ID="Navigation" runat="server" Title="功能菜单树" Border="false" BodyStyle="padding:6px;" Icon="User">
// <Items>
// <ext:TreePanel
// ID="exampleTree2"
// runat="server"
// Header="false"
// AutoScroll="true"
// Lines="false"
// UseArrows="true"
// CollapseFirst="false"
// RootVisible="false"
// Animate="false">
// <Store>
// <ext:TreeStore ID="TreeStore2" runat="server" OnReadData="GetExamplesNodes" >
// <Proxy>
// <ext:PageProxy>
// <RequestConfig Method="GET" Type="Load" />
// </ext:PageProxy>
// </Proxy>
// <Root>
// <ext:Node NodeID="Root" Expanded="true" />
// </Root>
// </ext:TreeStore>
// </Store>
// <Listeners>
// <ItemClick Handler="onTreeItemClick(record, e);" />
// <AfterRender Fn="onTreeAfterRender" />
// </Listeners>
// </ext:TreePanel>
// </Items>
// </ext:Panel>
// <ext:Panel ID="Settings" runat="server" Title="自定义功能" Frame="false" Border="false"
// BodyStyle="padding:16px;" Icon="Wand" Html="<b>您可在此添加自定义功能，或直接删除</b>" />