Struts 2系列之十四---Struts 2与AJAX(第2部分)

Struts2系列之十四Struts2与AJAX（第二部分）在上一篇文章《Struts2与AJAX（第一部分）》，我已经简单地介绍了s:tree/的一些用法，接下来我将继续深入讲解s:tree/的使用和通过DWR实现AJAX校验。更多s:tree/在Struts2的showcase中有两个s:tree/的例子，分别是静态树与动态树。所谓的静态树即是在编写JSP代码时通过s:treenode/生成树节点。我的上一篇文章的例子就是一个典型的静态树。而动态树则是在程序运行期间，Struts2运行时（Runtime）根据程序中的数据动态创建树节点。虽然在两个例子中s:tree/的theme属性都为“ajax”，但是从严格意义上来说，这两种树都不属于AJAX树，因为它们都是在输出页面时将全部节点加载到其中，而不是在父节点展开时通过XHR（XMLHttpRequest）获取节点数据。动态树下面我们先看一下动态树的例子，接着再一步步地将其改造为名副其实的AJAX树。下例将会把WEB应用程序的目录树展现在JSP页面中。因此，我需要先包装一下java.io.File类，代码如下：packagetutorial;importjava.io.File;publicclassFileWrapper{privateFilefile;publicFileWrapper(Stringpath){file=newFile(path);}publicFileWrapper(Filefile){this.file=file;}publicStringgetId(){returnfile_+file.hashCode();}publicStringgetName(){returnfile.getName();}publicStringgetAbsolutePath(){returnfile.getAbsolutePath();}publicFileWrapper[]getChildren(){File[]files=file.listFiles();if(files!=null&&files.length0){intlength=files.length;FileWrapper[]wrappers=newFileWrapper[length];for(inti=0;ilength;++i){wrappers[i]=newFileWrapper(files[i]);}returnwrappers;}returnnewFileWrapper[0];}}清单1src/tutorial/FileWrapper.java之所以需要对File类进行如此包装，是因为s:tree/用于动态树时，rootNode、nodeIdProperty、nodeTitleProperty和childCollectionProperty等属性都必填的。然后是Action类的代码如下：packagetutorial;importjavax.servlet.http.HttpServletRequest;importorg.apache.struts2.interceptor.ServletRequestAware;importcom.opensymphony.xwork2.ActionSupport;publicclassDynamicTreeActionextendsActionSupportimplementsServletRequestAware{privatestaticfinallongserialVersionUID=1128593047269036737L;privateHttpServletRequestrequest;privateFileWrapperroot;publicvoidsetServletRequest(HttpServletRequestrequest){this.request=request;}publicFileWrappergetRoot(){returnroot;}@OverridepublicStringexecute(){root=newFileWrapper(request.getSession().getServletContext().getRealPath(/));returnSUCCESS;}}清单2src/tutorial/DynamicTreeAction.java上述代码取得WEB应用程序的根目录的绝对路径后，初始化FileWrapper对象root。该对象将为JSP页面的s:tree/的根节点。如下代码所示：%@pagelanguage=javacontentType=text/html;charset=utf-8pageEncoding=utf-8%%@taglibprefix=suri=/struts-tags%!DOCTYPEhtmlPUBLIC-//W3C//DTDXHTML1.0Transitional//EN=:headtheme=ajaxdebug=true/scripttype=text/javascript/*![CDATA[*/functiontreeNodeSelected(arg){alert(arg.source.title+'selected');}functiontreeNodeExpanded(arg){alert(arg.source.title+'expanded');}functiontreeNodeCollapsed(arg){alert(arg.source.title+'collapsed');}dojo.addOnLoad(function(){vart=dojo.widget.byId('appFiles');dojo.event.topic.subscribe(t.eventNames.expand,treeNodeExpanded);dojo.event.topic.subscribe(t.eventNames.collapse,treeNodeCollapsed);vars=t.selector;dojo.event.connect(s,'select','treeNodeSelected');});/*]]*//script/headbodyh2DynamicTreeExample/h2divstyle=float:left;margin-right:50px;s:treeid=appFilestheme=ajaxrootNode=rootnodeTitleProperty=namenodeIdProperty=idchildCollectionProperty=children//div/body/html清单3WebContent/Tree.jsp因为s:tree/的treeCollapsedTopic和treeExpandedTopic属性都没有起作用，所以如果我们想要监听这两个事件，就必须使用上述代码的方法。最后是struts.xml配置文件：?xmlversion=1.0encoding=UTF-8?!DOCTYPEstrutsPUBLIC-//ApacheSoftwareFoundation//DTDStrutsConfiguration2.0//EN=Struts2_AJAX_DEMOextends=struts-defaultactionname=DynamicTreeclass=tutorial.DynamicTreeActionresultTree.jsp/result/action/package/struts清单4src/struts.xml发布运行应用程序，在浏览器地址栏中键入，有如下图所示页面：图1动态树示例AJAX树正如我在文章开头所说，Struts2所提供的静态树和动态树都不是严格意义上的AJAX树。下面就让我们来实现一个如假包换的AJAX树。首先要说明的是，Struts2的s:tree/默认是不支持这种按需加载数据的AJAX树。不过因为它是基于Dojo的树控件（Widget）所以要扩展也很方便。Dojo通过名为“TreeRPCController”的控件实现AJAX树，它会监听被控制树的事件。当发生展开节点的事件时，TreeRPCController就会向URL发送XHR请求，该URL由TreeRPCController的RPCUrl属性定义。XHR请求格式类似如下格式：=getChildren&data={node:{widgetId:file_226092423,objectId:C:\\ProgramFiles\\Tomcat5.5\\webapps\\Struts2_Ajax2,index:0,isFolder:true},tree:{widgetId:appFiles,objectId:}}&dojo.preventCache=1182913465392清单5XHR样本显而易见，请求中包含三个参数，分别是action为“getChildren”（固定值），data一个包含当前节点与树信息的JSON串和dojo.preventCache随机串，用于缓存不同节点的请求响应（父节点只会在第一次被展开时到服务器端加载数据，之后都是从浏览器的缓存中读取数据，可以提高应用程序性能）。首先我要先写一个加载树节点数据的Action类，代码如下：packagetutorial;importjava.util.Map;importcom.googlecode.jsonplugin.JSONExeption;importcom.googlecode.jsonplugin.JSONUtil;publicclassAjaxTreeActionextendsDynamicTreeAction{privatestaticfinallongserialVersionUID=3970019751740942311L;privateStringaction;privateStringdata;privateFileWrapper[]wrappers;publicvoidsetAction(Stringaction){this.action=action;}publicvoidsetData(Stringdata){this.data=data;}publicFileWrapper[]getWrappers(){returnwrappers;}@OverridepublicStringexecute(){if(getChildren.equals(action)){try{Objecto=JSONUtil.deserialize(data);Stringpath=((Map)((Map)o).get(node)).get(objectId).toString();wrappers=newFileWrapper(path).getChildren();}catch(JSONExeptione){e.pr