Ext.NET-WebForm之TreePanel组件
开启VS2017创建WebForm项目
打开NuGet搜索Ext.NET并安装
安装后可见
还自动帮我们创建了一个页面和文件夹项
打开自动添加的页面Ext.NET.Default.aspx,运行项目出错了,程序集Newtonsoft.Json找不到,估计是这个页面引用了这个第三方json解析包,而你还没引进项目
打开Nuget包管理器,搜索Newtonsoft.Json, 并安装。
发现已经按照了,但版本有更新,那就更新一些吧。。
更新完后,有个警告,先不管,在运行一下页面
可以显示了,但页面好像丢失CSS,很难看。
经过多次刷新和等待,终于页面显示正常了,原因是该页面引用了外站的CSS,所以加载慢了
以上算是Ext.NET WebForm入个门吧,现在我们加入主题—— TreePanel组件示例
Ext.NET 没有设计视图界面,所以一切都是蒙拐骗,做好心理准备就行。
添加一个WebForm新页面,aspx页面内容如下
然后再后置代码cs文件里添加动态创建TreePanel组件
整体结构
完整页面 WebForm1.aspx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using Ext.Net; namespace WebApplication1
{
public partial class WebForm1 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
Ext.Net.TreePanel tree = new Ext.Net.TreePanel(); this.PlaceHolder1.Controls.Add(tree); tree.ID = "TreePanel1";
tree.Width = Unit.Pixel();
tree.Height = Unit.Pixel();
tree.Icon = Icon.BookOpen;
tree.Title = "Catalog";
tree.AutoScroll = true; Ext.Net.Button btnExpand = new Ext.Net.Button();
btnExpand.Text = "Expand All";
btnExpand.Listeners.Click.Handler = tree.ClientID + ".expandAll();"; Ext.Net.Button btnCollapse = new Ext.Net.Button();
btnCollapse.Text = "Collapse All";
btnCollapse.Listeners.Click.Handler = tree.ClientID + ".collapseAll();"; Toolbar toolBar = new Toolbar();
toolBar.ID = "Toolbar1";
toolBar.Items.Add(btnExpand);
toolBar.Items.Add(btnCollapse);
tree.TopBar.Add(toolBar); StatusBar statusBar = new StatusBar();
statusBar.ID = "StatusBar1";
statusBar.AutoClear = ;
tree.BottomBar.Add(statusBar); tree.Listeners.ItemClick.Handler = statusBar.ClientID + ".setStatus({text: 'Node Selected: <b>' + record.data.text + '</b>', clear: false});";
tree.Listeners.ItemExpand.Handler = statusBar.ClientID + ".setStatus({text: 'Node Expanded: <b>' + item.data.text + '</b>', clear: false});";
tree.Listeners.ItemExpand.Buffer = ;
tree.Listeners.ItemCollapse.Handler = statusBar.ClientID + ".setStatus({text: 'Node Collapsed: <b>' + item.data.text + '</b>', clear: false});";
tree.Listeners.ItemCollapse.Buffer = ; Ext.Net.Node root = new Ext.Net.Node()
{
Text = "Composers"
};
root.Expanded = true;
tree.Root.Add(root); List<Composer> composers = this.GetData(); foreach (Composer composer in composers)
{
Ext.Net.Node composerNode = new Ext.Net.Node()
{
Text = composer.Name,
Icon = Icon.UserGray
};
root.Children.Add(composerNode); foreach (Composition composition in composer.Compositions)
{
Ext.Net.Node compositionNode = new Ext.Net.Node()
{
Text = composition.Type.ToString()
};
composerNode.Children.Add(compositionNode); foreach (Piece piece in composition.Pieces)
{
Ext.Net.Node pieceNode = new Ext.Net.Node()
{
Text = piece.Title,
Icon = Icon.Music,
Leaf = true
};
compositionNode.Children.Add(pieceNode);
}
}
}
} public class Composer
{
public Composer(string name) { this.Name = name; }
public string Name { get; set; } private List<Composition> compositions;
public List<Composition> Compositions
{
get
{
if (this.compositions == null)
{
this.compositions = new List<Composition>();
}
return this.compositions;
}
}
} public class Composition
{
public Composition() { } public Composition(CompositionType type)
{
this.Type = type;
} public CompositionType Type { get; set; } private List<Piece> pieces;
public List<Piece> Pieces
{
get
{
if (this.pieces == null)
{
this.pieces = new List<Piece>();
}
return this.pieces;
}
}
} public class Piece
{
public Piece() { } public Piece(string title)
{
this.Title = title;
} public string Title { get; set; }
} public enum CompositionType
{
Concertos,
Quartets,
Sonatas,
Symphonies
} public List<Composer> GetData()
{
Composer beethoven = new Composer("Beethoven"); Composition beethovenConcertos = new Composition(CompositionType.Concertos);
Composition beethovenQuartets = new Composition(CompositionType.Quartets);
Composition beethovenSonatas = new Composition(CompositionType.Sonatas);
Composition beethovenSymphonies = new Composition(CompositionType.Symphonies); beethovenConcertos.Pieces.AddRange(new List<Piece> {
new Piece{ Title = "No. 1 - C" },
new Piece{ Title = "No. 2 - B-Flat Major" },
new Piece{ Title = "No. 3 - C Minor" },
new Piece{ Title = "No. 4 - G Major" },
new Piece{ Title = "No. 5 - E-Flat Major" }
}); beethovenQuartets.Pieces.AddRange(new List<Piece> {
new Piece{ Title = "Six String Quartets" },
new Piece{ Title = "Three String Quartets" },
new Piece{ Title = "Grosse Fugue for String Quartets" }
}); beethovenSonatas.Pieces.AddRange(new List<Piece> {
new Piece{ Title = "Sonata in A Minor" },
new Piece{ Title = "sonata in F Major" }
}); beethovenSymphonies.Pieces.AddRange(new List<Piece> {
new Piece{ Title = "No. 1 - C Major" },
new Piece{ Title = "No. 2 - D Major" },
new Piece{ Title = "No. 3 - E-Flat Major" },
new Piece{ Title = "No. 4 - B-Flat Major" },
new Piece{ Title = "No. 5 - C Minor" },
new Piece{ Title = "No. 6 - F Major" },
new Piece{ Title = "No. 7 - A Major" },
new Piece{ Title = "No. 8 - F Major" },
new Piece{ Title = "No. 9 - D Minor" }
}); beethoven.Compositions.AddRange(new List<Composition>{
beethovenConcertos,
beethovenQuartets,
beethovenSonatas,
beethovenSymphonies
}); Composer brahms = new Composer("Brahms"); Composition brahmsConcertos = new Composition(CompositionType.Concertos);
Composition brahmsQuartets = new Composition(CompositionType.Quartets);
Composition brahmsSonatas = new Composition(CompositionType.Sonatas);
Composition brahmsSymphonies = new Composition(CompositionType.Symphonies); brahmsConcertos.Pieces.AddRange(new List<Piece> {
new Piece{ Title = "Violin Concerto" },
new Piece{ Title = "Double Concerto - A Minor" },
new Piece{ Title = "Piano Concerto No. 1 - D Minor" },
new Piece{ Title = "Piano Concerto No. 2 - B-Flat Major" }
}); brahmsQuartets.Pieces.AddRange(new List<Piece> {
new Piece{ Title = "Piano Quartet No. 1 - G Minor" },
new Piece{ Title = "Piano Quartet No. 2 - A Major" },
new Piece{ Title = "Piano Quartet No. 3 - C Minor" },
new Piece{ Title = "Piano Quartet No. 3 - B-Flat Minor" }
}); brahmsSonatas.Pieces.AddRange(new List<Piece> {
new Piece{ Title = "Two Sonatas for Clarinet - F Minor" },
new Piece{ Title = "Two Sonatas for Clarinet - E-Flat Major" }
}); brahmsSymphonies.Pieces.AddRange(new List<Piece> {
new Piece{ Title = "No. 1 - C Minor" },
new Piece{ Title = "No. 2 - D Minor" },
new Piece{ Title = "No. 3 - F Major" },
new Piece{ Title = "No. 4 - E Minor" }
}); brahms.Compositions.AddRange(new List<Composition>{
brahmsConcertos,
brahmsQuartets,
brahmsSonatas,
brahmsSymphonies
}); Composer mozart = new Composer("Mozart"); Composition mozartConcertos = new Composition(CompositionType.Concertos); mozartConcertos.Pieces.AddRange(new List<Piece> {
new Piece{ Title = "Piano Concerto No. 12" },
new Piece{ Title = "Piano Concerto No. 17" },
new Piece{ Title = "Clarinet Concerto" },
new Piece{ Title = "Violin Concerto No. 5" },
new Piece{ Title = "Violin Concerto No. 4" }
}); mozart.Compositions.Add(mozartConcertos); return new List<Composer> { beethoven, brahms, mozart };
}
} }
运行查看
Ext.NET-WebForm之TreePanel组件的更多相关文章
- Javascript - ExtJs - TreePanel组件
TreePanel组件(Ext.tree.TreePanel)logogram:Ext.tree.Panel | xtype:treepanel 树与节点 树面板组件的根是源头,从根上拓展出其它的子节 ...
- Ext JS学习第六天 Ext_window组件(三)
此文用来记录学习笔记: 今天再来一个例子巩固一下学习的window: –例2: 在window中添加子组件,并讲解常用查找组件的方式: •重点分析:该实例主要针对于组件的查找进行详细的讲解,在以后的应 ...
- Ext.Net中如何获取组件
我们在编写函数function的时候,常常需要用到页面上的组件.这时候就需要调用组件. 在Ext.net中,调用组件可以用.App.ID.(ID指的是想要调用的组件的ID). 例如: 我写一个函数需要 ...
- [ExtJS5学习笔记]第八节 Extjs5的Ext.toolbar.Toolbar工具条组件及其应用
本文地址:http://blog.csdn.net/sushengmiyan/article/details/38515499 本文作者:sushengmiyan ------------------ ...
- Ext.js入门:TreePanel(九)
一:最简单的树 二:通过TreeNode自定义静态树 三:用TreeLoader加载数据生成树 四:解决IE下非正常加载节点问题 五:使用TreeNodeUI 六:带有checkbox的树 七:编辑树 ...
- Ext.js入门:TabPanel组件(八)
一:TabPanel组件简介 二:简单代码示例 三:使用iframe作为tab的标签页内容 四:动态添加tabpanel的标签页 五:为tabpanel标签页添加右键菜单 方式一: <html ...
- Ext如何动态添加一行组件
用的column布局,点击一个按钮能添加一行组件,如文本框,有下拉框等. 如: 效果: 实现方法如下: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 ...
- EXT.net 1.x TreePanel的一个坑
Ext.net TreePanel有一个方法 drptreepanel.setChecked({ ids: idsarray, silent: true }); 如果TreePanel里有1,3两个 ...
- Ext.NET webform
Ext.NET是基于跨浏览器的ExtJS库和.NET Framework的一套支持ASP.NET AJAX的非开源Web控件,包含有丰富的Ajax运用,其前身是Coolite[1] .
随机推荐
- Vue介绍以及模板语法-插值
1.Vue的介绍 Vue是一套用于构建用户界面的渐进式框架. 注意:Vue是一个框架,相对于jq库来说,是由本质的区别的:https://cn.vuejs.org/ Vue不支持IE8及一下版本,因为 ...
- js键盘事件以及键盘事件拦截
一.键盘事件 onkeydown: 按下键盘时触发 onkeypress: 按下有值的键时触发 注意: onkeypress按下 Ctrl.Alt.Shift.Meta 这样无值的键,这个事件不会触发 ...
- springMVC校验器(validator)
springmvc使用的是Hibernate Validator(和Hibernate的ORM无关)来完成校验功能 一.普通校验 1.导入jar包 2.编写校验错误配置文件 3.配置校验错误信息文件 ...
- ojdbc.jar在maven中报错(下载不了)
一.问题 由于oracle的版权问题,java连接oracle的jar(ojdbc.jar)在maven的中央仓库下载不到,然后导致maven项目报错. 二.解决 第一步:下载ojdbc.jar 由于 ...
- html5+css+js简单了解
最近敲了敲HTML5的代码,感觉真的是很吸引人的东西,反正我是非常喜欢的,所以想写一点关于HTML的东xi首先呢我了解的不多,所以也是想写一点点我对它的认识.说起HTML5是打开Pycharm敲pyt ...
- Qt 显示图片
QImage qImag("img.jpg"); //qImag = qImag.scaled(width, height); //缩放图片 qImag = qImag.scale ...
- [b0038] python 归纳 (二三)_多进程数据共享和同步_队列Queue
1 队列读写 # -*- coding: utf-8 -*- """ 多进程 共享 队列 multiprocessing.Process 逻辑: 一个进程往队列写数据, ...
- git在idea中的冲突解决(非常重要)
1.什么是冲突 冲突是指当你在提交或者更新代码时被合并的文件与当前文件不一致.读起来有点绕,结合下面的案例理解. 从上面对冲突的定义来看,冲突时发生在同一个文件上的. 2.生产上冲突的场景 常见冲突的 ...
- Linux实现免密码登录
一.验证ssh远程登录,未作免密处理的两台机器,登录时,是需要输入密码的 二.本地系统执行 ssh-keygen -t rsa 命令,生成密钥文件 三.在相应的目录下查看生成的密钥文件,其中:id_r ...
- 文:你可以杀我,但你不能评价(judge)我
原创 豆瓣影评:“现代战争启示录”豆友影评 2006-12-18 20:24:20 本文刊载于<豆瓣影评>豆友“芹泽虾饺菌”的影评 原文标题<剃刀边缘的疯狂> 文/芹泽虾饺菌 ...