Ext JS4序列教程之二：异步加载Accordion和Tree菜单

Ext JS4序列教程之二：异步加载accordion和Tree菜单

1、序言

EXT JS4序列教程主要讲解WEB开发中一些常用的组件，例如Tree,Grid,Combobox,form 等，EXT JS4的出现为广大程序员带来了福音，我们可以用较少的代码，实现很炫丽的效果，我在很多项目的架构中都使用EXT JS作为核心的WEB框架，配合jQuery框架，大家很容易实现一个用户体验很不错的软件系统（我们称之为高大上，哈哈哈）。EXT JS自推出以来，其性能就饱受开发的砰击，在EXT JS4以前的版本，性能确实不是很好，不过比起jQuery Easy UI，那还是要好很多的，从EXT JS4.2以后的版本开始，性能还是很不错的，代码也比较精简，结构清晰，纯面像对象的语法，BUG也较EXT JS4.1少了很多，相对比较稳定，EXT JS4推出了MVC模式的设计风格，使得代码结构更加清晰，可读性更好，非常类似于使用JAVA SWING和C# WinForm开发，但如果没有接触过AJAX框架的程序员，第一次使用EXT JS4会碰到各种各样的问题，本教程教从零开始讲解EXT JS4,从客户端到服务器都有完整的代码，服务端使用SSH框架，用注解方式进行开发，抛弃了繁锁的配置文件（我本人相当讨厌配置文件，在我设计的架构中，配置文件几乎为零）。关于源码，由于Google无法访问（IT业的一大悲剧），大家可以到CSDN上下载。

本文从实际应用出发，讲解与WEB系统开发息息相关的实例，EXT JS功能很丰富，由有时间的原因，我不会所有的功能都讲到（我都是利用业余时间写教程，目前在一家公司担任高级架构师，工作很忙，我写教程主要是在互联网上和大家一起分享自己的开发经验），大家按照本套系列教程来逐步开发代码，可以实现一个功能比较完整的WEB系统。本教程后端使用的架构为Struts2+Hibernate4+Spring4，后续我将会逐一介绍SSH架构的搭建。关于https://www.360docs.net/doc/c63646296.html,的教程，会在后续推出。

作者：山人

2014/11/14

1、异步accordion和Tree菜单

好了，各位观众，前面我们讲了layout布局中的border布局，本章我要介绍一个另大家兴奋的东西，那就是异步accordion和Tree菜单，这类菜单在实际的项目中经常会用到，accordion菜单作为功能模块菜单，Tree菜单作为功能点菜单，由其是规模较大的项目，应用较为普遍。我在网上搜索发现类似的例子有很多，但是很少有异步加载Tree的例子，很多都是一次性加载，这不仅会消耗多余的资源，造成服务端和客户端的查询、显示效率下降，而且不利于权限控制，例如Spring-acegi安全框架。如果是政府类的安全性和保密性要求较高的应用系统，是不适用的，前段时间闹的沸沸扬扬的香港占中事件，国外黑客宣布要入侵中国的电子政务系统，以支持香港占中，这对我国的电子政务系统的安全性提出了挑战，一个很小的漏网都可能会成为黑客入侵的目标，造成较大的损失。所以，菜单的异步加载和权限控制是很有必要的，因为只有异常加载菜单才能较好的与安全框架集成，如果把权限控制放在客户端脚本里，黑客就可以通过修改脚本执行顺序、跨站脚本攻击等技术攻击我们的系统，得到系统管理员的权限。说了这么多题外话，我们先来看一下效果：

怎么样，高大上吧？其实高大上就是这么来的。当然，很多按钮位置错乱、节点错

乱、半天不响应的UI也是这么来的，我们称之为“土肥圆”，不知道你有没有见过，反正我是见过，最让人佩服的是，这样的系统还被客户使劲的夸，我们只能彻底拜服在这位项目经理的脚下。由此可知，做好一个系统，不是你的功能做的有多强就可以的，关键还是要维护好客户关系的。以上界面具体实现步骤如下：

注意，大家可以把EXT JS类库定义在一个JSP中，当其他页面要引用的时候，可以使用JSP的包含动作将类库引入，这样也符合代码重用的目的，同时要把ext-lang-zh_CN.js 这个文件引进来，这个是Ext JS的语言文件，用来汉化EXT JS。

接下来讲解几个EXT JS的函数，第一个函数EXT的AJAX请求函数，这个函数用来发送异步请求，向服务器请求数据，服务器收到请求后将数据返回给客户端，由EXT JS进行处理，函数如下：

第二个函数，哦，对了，这里我们不能称之为函数，应该称之为模型（Model），在JAVA 和C#里，我们经常要定义Model，用来定义和存储对象的数据，EXT JS的模型和各种服务端编程语言是一样的，只是写法不一样，EXT JS的模型用来存储JSON格式的数据，Model 存储在store里面，store就像一个数据库，里面可以有表，而Model的角色就是表，定义

一个模型是这样的。

第二步：定义一个MODEL

客户端的完整代码如下：

第五步：服务端代码

我们在Struts2的Action中添加两个方法，第一个方法用来加载accordion菜单和Tree 的根菜单所需的数据

第二个方法用来查询Tree菜单下的子菜单

第七步：POJO类

第八步：表结构

第九步：数据库中的数据展示

Menu表中的数据

MenuPanel表中的数据

ASP NET+TreeView树型菜单操作实例(代码调试通过)

https://www.360docs.net/doc/c63646296.html, TreeView树型菜单操作实例(代码调试通过) 本实例完成TreeView树型菜单添加,修改,删除,绑定DropDownList功能,移动功能读者可以自行书写.aspx代码

TreeView操作实例

节点名

树形DP之个人整理总结

树形DP 二叉苹果树(ural 1108) 题目意思：有一棵苹果树，苹果树的是一棵二叉树，共N个节点，树节点编号为1~N，编号为1的节点为树根，边可理解为树的分枝，每个分支都长着若干个苹果，现在要要求减去若干个分支，保留M个分支，要求这M个分支的苹果数量最多。输入： N M 接下来的N-1行是树的边，和该边的苹果数N and M (1 ≤ M < N; 1 < N ≤ 100) 输出：剩余苹果的最大数量。 input 5 2 1 3 1 1 4 10 2 3 20 3 5 20 output 21 算法：删除了某个分支，那么这个分支下的子分支也同时删除。保留M个分支，也就是删除N-M-1个分支。剩余的最多苹果数=总苹果数-剪掉的苹果数。注意本题给的边并没有按照树根--树叶的形式来给，也没有按照树的顺序给出边。本来想一个节点对应一个分支长着的苹果数量，cost[v]就表示v这个节点的苹果数，可以这样做，但是在输入的时候，不知道这个苹果数量是那个节点的，因为不知道哪个是哪个的子结点。所以用了无向图和苹果数加到边上去。我的解法中：这题的树状DP的整体思想个pku3345是一样的。有一些不一样的地方要注意一下：本程序其实不仅仅针对二叉树，可以是任意的树，删除任意个分支都有算。 #include #include #include using namespace std; #define MN 110 int f[2*MN],p[MN],tmp[MN];

int N,M; bool visit[MN]; struct NODE { int val; int cost; }; vectorG[MN]; inline int max(int a,int b) { return a>b?a:b; } inline int min(int a,int b) { return a

Authorware下拉菜单与多级菜单的制作

Authorware下拉菜单与多级菜单的制作Authorware制作下拉菜单需要用到交互图标所提供的下拉菜单首先是擦除原有菜单的“文件”二字在用Authorware的菜单交互制作菜单时，Authorware总会在菜单栏上加一个“文件”菜单。这个“文件”菜单与我们的作品总是那么不协调。所以咱们先想办法去掉这个“文件”菜单。具体步骤如下： 1、在主流程线上拖一个交互图标，命名为“文件”。在其右侧放一个组图标（内容为空），在弹出的对话框中，选择“下拉菜单”。双击组图标上方的小方块，弹出属性对话框，选择“永久”及“退出交互”，其他选项就用默认的设置。 2、在交互图标的下方，放一个擦除图标，然后运行一下演示窗口，用鼠标单击演示窗口标题栏上的“文件”二字。仔细看，那个“文件”菜单会随之消失。运行一下看看是不是消除了。下拉菜单制作首先在流程线上拖入一交互图标，命名为“文件”，在其右侧放一个组图标，在弹出的对话框中，选择“下拉菜单”。将这个组图标命名为“新建”，范围选择“永久”。然后在其右侧继续放入五个这样的组图标，分别命名为：“打开”、“- ”（这个减号表示分界线）、“保存”、“另存为”、“- ”。最后再放上一个计算图标，命名为“退出”，打开它，输入" quit(0) " ，这样一个下拉菜单就做好了，运行下便能看到效果。

多级菜单制作 1、在流程线上放一个交互图标，命名为“图片欣赏”，在其右侧放一个组图标，选择交互类型“下拉菜单”。将这个组图标命名为“植物图片”。双击组图标上方的那个矩形色块，在弹出的属性对话框中，点击“响应”选项卡，选中其中的“永久”复选项，并将“分支”的值选为“返回”。您可以继续添加几个这样的组图标，分别命名为“动物图片”、“风景图片”等等，当然随便您啦。 2、按同样的方法，在主流程线上再放一个交互图标，其右侧也放几个组图标，分别命名为“梅花”、“兰花”、“菊花”等。各项设置同上面的步骤一样。惟一的不同，就是要把交互图标的命名删除，也就是说要让这个交互图标的名字为空。

动态规划专题(六)：树型动态规划

动态规划专题（六）：树型动态规划（重庆巴蜀中学黄新军）信息学竞赛中通常会出现这样的问题：给一棵树，要求以最少的代价（或取得最大收益）完成给定的操作。有很多问题都是在树和最优性的基础上进行了扩充和加强，从而变成了棘手的问题。这类问题通常规模较大，枚举算法的效率无法胜任，贪心算法不能得到最优解，因此要用动态规划解决。和一般动态规划问题一样，这类问题的解决要考虑如下三步： 1、确立状态：几乎所以的问题都要保存以某结点为根的子树的情况，但是要根据具体问题考虑是否要加维，加几维，如何加维。 2、状态转移：状态转移的变化比较多，要根据具体问题具体分析，这也是本文例题分析的重点。 3、算法实现：由于模型建立在树上，即为树型动态规划。【例题1】二叉苹果树【问题描述】有一棵苹果树，如果树枝有分叉，一定是分2叉(就是说没有只有1个儿子的结点)，这棵树共有N个结点(叶子点或者树枝分叉点)，编号为1-N,树根编号一定是1。我们用一根树枝两端连接的结点的编号来描述一根树枝的位置。下面是一颗有4个树枝的树：现在这颗树枝条太多了，需要剪枝。但是一些树枝上长有苹果。给定需要保留的树枝数量，求出最多能留住多少苹果。【文件输入】第1行2个数，N和Q(1<=Q<=N,1

DIV+CSS实现二级下拉菜单

二级下拉菜单实现代码

菜单树的设计与实现实验报告

一、问题描述创建table保存具有层次结构的菜单树信息，记录菜单的ID，名称，描述，父菜单（可为空）和可用性（enable/disable），菜单的深度无限制。二、实验内容及步骤 1.首先以sysdba身份登录数据库，命令为：conn / as sysdba 2.创建用户表空间menu，数据文件为：d:\menu.dbf，大小20M,相关命令如下： create tablespace menu datafile 'd:\menu.dbf' size 20M; 3.创建新用户yjmin，默认表空间为新创建的menu表空间，相关命令如下： create user yjmin identified by yjmin default tablespace menu; 4.为新创建用户yjmin授权connect和resource角色； 5.以新创建的用户yjmin登录数据库,命令为：conn yjmin/yjmin; 6.创建序列，自动生成菜单ID，相关命令如下： create sequence id_seq start with 1 increment by 1; 7.创建表menu_tab保存菜单信息： create table menu_tab (id number primary key, name varchar2(50) not null, description varchar2(200), parent_menu varchar2(50), available varchar2(10) not null); 8.向表menu_tab中插入菜单数据，以示例数据插入，并提交插入的数据。 9.打开PL/SQL输出信息，命令为：set serveroutput on; 10.创建函数获取菜单ID: create or replace function get_menu_id (v_name varchar2) return number as

MC领地指令大全

[spoiler] 总命令 /res ? [页数] - 显示帮助，不写页数则显示第一页. /resadmin - 在使用管理命令时使用权限表： admin：领地的全权管理权限，仅能给与某玩家container：是否能使用箱子，发射器等 bucket：设置是否能使用桶 ignite：点火的权限 piston：活塞是否能使用 build：建造权限（包括destroy和place） destroy：毁坏权限 place：放置权限 move：进入权限 tp：传送权限 use：使用权限（工作台，炉子等） subzone：是否能设置子空间 tnt：设置tnt是否有效 creeper：设置JJ怪是否有效（设置F的话JJ怪就废了）damage：设置领地内是否能造成伤害（不能防止被挤死）monsters：设置是否刷新怪物

animals：设置是否刷新动物 firespread：火是否能蔓延 flow：液体流动，包括waterflow和lavaflow waterflow：水的流动 lavaflow：岩浆流动 healing：设置是否能恢复生命 pvp：设置是否能pvp 选择命令 /res select [x] [y] [z] - 选择领地的长方体区域，X Y 和Z 都是从你当前位置为中心的距离，你也可以用一个工具（默认是木斧）来选择地块。/res select chunk - 选取一整个chunk。 /res select expand [格数] - 向你的前方延伸选区。 /res select size - 显示已选择区域的尺寸。 /res select shift [格数] - 向你的前方移动选区。 /res select vert - 把选区延伸到从天顶到地底。创建命令 /res area [add/remove/replace] <领地名> [区域id] - 向叫做[领地名]的领地增加(add)、从其中去除(remove)或是替换(replace) 区域。可与同一领地内的区域重合。 /res create [领地名] - 选择好区域后创建一个叫做[领地名]的领地

Excel制作一二级下拉菜单

Excel2010制作一二级下拉菜单作者：郇冰洁文章来源：本站原创点击数：8530 更新时间：2011-7-6 1. 功能描述。 Excel中用户输入数据时，Excel会产生一个下拉菜单，只允许用户输入菜单中预设好的这些数据。一级的下拉菜单常用于性别、政治面貌、是否判断内容；除此之外，二级的下拉菜单也很常用，例如在某企业的招聘网站上，你选择某个部门，后面就只能选择属于这个部门的一些职位，那么这些下拉菜单是如何制作的呢？ 2. 一级下拉菜单 1) 选中“性别”数据区域 2) 执行“数据/有效性”命令，打开“数据有效性”对话框；图1 3) 单击“设置”选项卡，在“允许”栏选择“序列”，“来源”中输入“男，女”（不含引号，用英文单引号分隔）；

图2 4) 单击“确定”按钮。 3. 二级下拉菜单 1) 先列出一个基本表表1。将A17:A19选中，在地址栏定义为“人力资源部”，并回车。检验的方法可以再选择A17:A19，地址栏会显示“人力资源部”。旧版本的MSO Excel会有一个专门的名称定义菜单，2010这样的定义方式更方便了，大家可以自己对照。

图3 同样方法，将B17:B20和C17：C20分别定义为“财务部”和“市场部”。 2) 再将A16:C16定义为“部门”。至此，层级上的定义就做好了，可以利用地址栏检验一下定义是否成功。

图4 3) 在要绘制的工作表表2里面，列出“部门”和“职位”两列。

图5 4) 按照之前“一级下拉菜单”的制作步骤，分别给“部门”列下的数据区域制作下拉菜单，不同的是，在“数据有效性”对话框中，“来源”是“=部门”，这个部门就是之前基本表中定义为“部门“，实际上包含了“人力资源部，财务部，市场部”三个内容。图6 如果出现“源格式错误”提示框，需要检查一下定义是否正确，但是有的时候是软件抽象，不用理他，重新试试。这样，“部门”这一列就可以选择这三个部门了。

Ext JS4序列教程之二 ：异步加载Accordion和Tree菜单