构建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>" />