ext js4序列教程之二 ：异步加载accordion和tree菜单

《ext js4序列教程之二 ：异步加载accordion和tree菜单》由会员上传分享，免费在线阅读，更多相关内容在应用文档-天天文库。

1、ExtJS4序列教程之二：异步加载accordion和Tree菜单1、序言EXTJS4序列教程主要讲解WEB开发中一些常用的组件，例如Tree,Grid,Combobox,form等，EXTJS4的出现为广大程序员带来了福音，我们可以用较少的代码，实现很炫丽的效果，我在很多项目的架构中都使用EXTJS作为核心的WEB框架，配合jQuery框架，大家很容易实现一个用户体验很不错的软件系统（我们称之为高大上，哈哈哈）。EXTJS自推出以来，其性能就饱受开发的砰击，在EXTJS4以前的版本，性能确实不是很好，不过比起jQueryEasyUI，那还是要好很多的，从EXTJS4.2以后的版

2、本开始，性能还是很不错的，代码也比较精简，结构清晰，纯面像对象的语法，BUG也较EXTJS4.1少了很多，相对比较稳定，EXTJS4推出了MVC模式的设计风格，使得代码结构更加清晰，可读性更好，非常类似于使用JAVASWING和C#WinForm开发，但如果没有接触过AJAX框架的程序员，第一次使用EXTJS4会碰到各种各样的问题，本教程教从零开始讲解EXTJS4,从客户端到服务器都有完整的代码，服务端使用SSH框架，用注解方式进行开发，抛弃了繁锁的配置文件（我本人相当讨厌配置文件，在我设计的架构中，配置文件几乎为零）。关于源码，由于Google无法访问（IT业的一大悲剧），大家

3、可以到CSDN上下载。本文从实际应用出发，讲解与WEB系统开发息息相关的实例，EXTJS功能很丰富，由有时间的原因，我不会所有的功能都讲到（我都是利用业余时间写教程，目前在一家公司担任高级架构师，工作很忙，我写教程主要是在互联网上和大家一起分享自己的开发经验），大家按照本套系列教程来逐步开发代码，可以实现一个功能比较完整的WEB系统。本教程后端使用的架构为Struts2+Hibernate4+Spring4，后续我将会逐一介绍SSH架构的搭建。关于ASP.NET的教程，会在后续推出。作者：山人2014/11/141、异步accordion和Tree菜单好了，各位观众，前面我们讲了

4、layout布局中的border布局，本章我要介绍一个另大家兴奋的东西，那就是异步accordion和Tree菜单，这类菜单在实际的项目中经常会用到，accordion菜单作为功能模块菜单，Tree菜单作为功能点菜单，由其是规模较大的项目，应用较为普遍。我在网上搜索发现类似的例子有很多，但是很少有异步加载Tree的例子，很多都是一次性加载，这不仅会消耗多余的资源，造成服务端和客户端的查询、显示效率下降，而且不利于权限控制，例如Spring-acegi安全框架。如果是政府类的安全性和保密性要求较高的应用系统，是不适用的，前段时间闹的沸沸扬扬的香港占中事件，国外黑客宣布要入侵中国的电

5、子政务系统，以支持香港占中，这对我国的电子政务系统的安全性提出了挑战，一个很小的漏网都可能会成为黑客入侵的目标，造成较大的损失。所以，菜单的异步加载和权限控制是很有必要的，因为只有异常加载菜单才能较好的与安全框架集成，如果把权限控制放在客户端脚本里，黑客就可以通过修改脚本执行顺序、跨站脚本攻击等技术攻击我们的系统，得到系统管理员的权限。说了这么多题外话，我们先来看一下效果：怎么样，高大上吧？其实高大上就是这么来的。当然，很多按钮位置错乱、节点错乱、半天不响应的UI也是这么来的，我们称之为“土肥圆”，不知道你有没有见过，反正我是见过，最让人佩服的是，这样的系统还被客户使劲的夸，我们

6、只能彻底拜服在这位项目经理的脚下。由此可知，做好一个系统，不是你的功能做的有多强就可以的，关键还是要维护好客户关系的。以上界面具体实现步骤如下：第一步：老姜一块，我们需要在JSP中引入ExtJS4的类库，这一步是必须的。<%@pagepageEncoding="UTF-8"%><%Stringpath=request.getContextPath();StringbasePath=request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%><%--样式文件，加载全

7、部样式--%><%--extjs文件--%>