弄了小半天,利用jquery实现了一个菜单(select)联动,属原创,当然也参考了其它的作品。若有更好的办法肯请指教。
在实现之前,需要让struts2支持json格式的数据。这里需要一个插件jsonplugin-0[1].32.jar。中间的32表示支持struts2.0.x。如果使用struts2.1以上,则需要jsonplugin-0[1].34.jar。然后在struts.xml中配置如下:

<package name="ajax" extends="json-default"> 

 <action name="ajaxQuery" class="Action"> 

 <result type="json"></result> 

 </action> 

 </package>


支持json的action要独立创建一个包,并继承json-default。

实现菜单(表单)联动主要有以下步骤(初始化相对容易,这里就不说了,主要讨论当鼠标事件发生的时候发生的变化,这里主要指二级联动):

1.发生事件。
经过在网上一番查找,发现表单联动所用的鼠标事件都是onChange,所以这里也用onChange吧。

2.向服务器发出请求。
在onChange的函数里就需要写js代码了,如下:

function selectOnClick(){ 

 var url = 'ajaxQuery!ajaxQuerySubOrgs.action'; 

 var params = {orgFirstLevelId:$([color=red]'#orgFirstLevelId'[/color]).val()}; 

 $.post(url,params,callback,'json');


上面红色的部分是第一级select的id。通过这个id,要得到我们选中哪个值了,要通过这个值查找二级select。这里面的params组成的是一个js的对象,通过这个对象将值连通url传到后台的Action。回调函数callback第五步。

3.服务器向应请求,并查找返回时所需要的二级表单的数据。
这一步相对简单,就是要得到二级select的数据,每个人的情况不一样,不再讨论。

4.将服务数据封装成JSON格式,并返回到客户端。
这一步最关键。因为js支持json的数据格式,因此要将得到的数据转成json。这里使用到了一个java版的将普通数据转成json数据的包json-lib-2.3-jdk13.jar。这个包还需要以下几个包的支持:

jakarta commons-lang 2.4 

 jakarta commons-beanutils 1.7.0 

 jakarta commons-logging 1.1.1 

 jakarta commons-collections 3.2 

 ezmorph 1.0.6


这里最重要的就是最后两个包需要下,其它的在SSH框架里都有。但collections的版本在SSH里不够,这个包必须要3.2以上的才行。因为json是需要map类型的数据支持的,而老版本的collections都不支持这个格式。
首先要对二级select的数据做成Map。因为select下的option需要两个值,一个是属性value,另一个就是显示在select上的值。因此将May中的key作为value,将May中的value作为select的值。值容易得到,而key可以使用数据库中的id,这样会更方便。当然也可重新生成key。因此,一个json对象就需要map中存两项数据,一个是json中的key,一个是json中的value(一个json对象的格式是这样的:{id:value}。而一个select中需要两个json对象,因此需要这样的json格式:{id:值,value:值},这样就构成一个select需要的数据。其中“,”号左右分别是一个map中的两个数据项。)代码如下:

for (Iterator<Orgnization> iterator = orgsList.iterator(); iterator.hasNext();) { 

 Orgnization org = (Orgnization) iterator.next(); 

 Map<String,String> tempMap = new HashMap<String,String>(); 

 //制做用于转换json格式的list 

 tempMap.put("id", Integer.toString(org.getId())); 

 tempMap.put("name", org.getName()); 

 orgsListJson.add(tempMap); 

 }


最后一行代码的意思是将生成有两个数据项的map存到一个list中。在最后就要用到上面的json工作进行转换。代码如上:
JSONArray json = JSONArray.fromObject(orgsListJson);
有这句话就够了。然后就是返回(这一步参照了其它网友的内容,可能有更好的方法,期待探讨):

HttpServletResponse response= ServletActionContext.getResponse(); response.setContentType("text/html;charset=UTF-8"); 

 response.setHeader("Cache-Control", "no-cache"); 

 PrintWriter out = response.getWriter(); 

 out.print(json); out.close();


在Action中,返回success就可以了。

5.客户端接收,并改变html代码。
这一步就是利用回调函数改变html代码:

function callback(data){ 

 var obj = eval(data); 

 $("#orgSecondLevelId option").remove(); 

 for(var p in obj){ 

 var org = obj[p]; 

 var ops = $("#orgSecondLevelId"); 

 ops.append("<option value="+org.id+">"+org.name+"</option>"); 

 }


这个代码只要懂点jquery的人都能看懂,关键是最后一步,我用字符串拼接的方式追加每个<option>,可能不太好。orgSectonLevelId是二级select的id。我们要动态的改变它下面的<option>。