今天遇到一个问题：

有三个下拉列表，分别是：消息大类，消息中类，消息小类；要用级联的方式展现：如图：

?当选择 消息大类 时 ，刷出消息中类，内容只包含 大类选择条件下的类型！同理? 选择中类 刷出小类！

（注意这里的下拉列表的值 是从数据库中查出来的，不是写死在html；

从数据库中查出来的数据，特别是中类和大类难免有些重复现象，怎么取出重复呢？看这里（使用map转换整理中）

）

下面用两种方法来介绍 下拉列表级联：

1.dwr方式：
具体的dwr配置请看：

下面只介绍级联用到的js：

?

?

function getChild(pareantType,childType){
		if(pareantType==null||pareantType.length<1)
			 // parentType：当前下拉列表的参数（可更具自己的查询条件，传值【可以是选中的code，或type....】） 
			 //childType:要刷出子列表的 参数（同上） 
	    {
	        return;
	    }    
	    try
	    {  
		    var id = document.getElementById(pareantType).value;
	    	MsgTypeService.getMsgType(id,childType,function(data)
	    			 // id : 查询使用到的条件，更具自己的Service用的参数，可以传零到多个 
	    			 // data: service放回的list 也就是子列表中显示的数据了
	    	{		
	    		if(data!=null)
	    		{		var oBtsTypeNumber=document.all(childType);
	    				while( oBtsTypeNumber.childNodes.length>0) {  
   								oBtsTypeNumber.removeChild(oBtsTypeNumber.childNodes(0));
   							}
   						var op= document.createElement("Option")
   						op.value="";
	    				op.text="--全部--";
	    				oBtsTypeNumber.add(op);
	    				//这里是将 子列表中数据清空
					for(i=0;i<data.length;i++)
					{
				    		var no=document.createElement("Option");
				    		 //为子列表添加数据，遍历 
				        	no.value= data[i].code;   
				          	no.text = data[i].midType; 

				          	//注意这里的 code 和midType这两个值，是 ，返回 list 的泛型（的两个字段），并且，在配置dwr.xml时要注意，和泛型相一致，否则会出现，code或midType为空或不是对象的错误警告！ 
				          	oBtsTypeNumber.add(no);  
				            if("${pareantType}"==data[i].midType){
				           		no.selected="true";  	
				         	 } 	
  					 	}
	    		}
	    	});
	    }
	    catch(e)
	    {}
	}

?

?

?

，解释一下：返回list的泛型：

dwr.xml:

?

<convert converter="bean" match="com.iman.nrms.nrmwns.prm.message.domain.model.MsgType"/>	

		//  com.iman.nrms.nrmwns.prm.message.domain.model.MsgType  dwr 调用返回list 的泛型
		<create creator="spring" javascript="MsgTypeService">
            <param name="beanName" value="msgTypeService"/>
			<include method="getMsgType"/>
			<include method="getMsgMidType"/>  
			
		</create>

		在哦jsp页面代码中 用到的 code 和midType 都是 MsgType 这个po中的属性！，根据自己的需要！再在这里配置！

?

?下面就是掉 dwr的方法了：

<td width="4%" rowspan="3"><img src="${path}/page/wrm/image/search.gif" width="40" height="39"></td>
       <td nowrap="nowrap">消息大类</td>
	        
	   <td>
	    
	   <s:select list="msgBigTypeList"  name="msgType.bigType" onchange="getMidType('bigType','midType');"
	   				  id="bigType" cssClass="select" headerKey="" headerValue="--请选择--" listKey="code" listValue="bigType"></s:select>
	   
	   </td>
	   <td nowrap="nowrap">消息中类</td>
	        
	   <td>
	    
	   <s:select list="msgMidTypeList" name="msgType.midType"  onchange="getSmlType('midType','smlType');"
	   				  id="midType" cssClass="select" headerKey="" headerValue="--请选择--" listKey="code" listValue="midType"></s:select>
	   

??

方法2：（推荐使用方法）

?

这个方法首先要为每一个?</td>下拉列表写一个 function（）；

?

这里用到了三个下拉列表，级联了两次，就要写两个：

??

/**

 大类与中类级联
 */
    function getMidType(parentValue,childName){

    	var url= "${path}/message/getMidTypeByBigType.action";
    	var propertyName = "midType";
    	fnGetChildValueList(parentValue , childName , url , propertyName );
    }
    /**
    中类与小类级联
    */
    function g