下拉框二級聯動，用ajax來實現是已經非常成熟的技術了。但對於我這個java菜鳥來說，真的是費了九牛二虎之力，各種百度，各種測試。終於得以實現。程式碼相對於網上的容易理解些。現把程式碼和我在編寫的過程中遇到的問題貼出來，對自己也是一個總結，同時也希望能幫助到跟我一樣的菜鳥。

如上圖，實現的是不同的公司，有不同的部門。

前臺jsp程式碼：

	<tr><td width="16%" bgcolor="#dfdfdf">所屬單位/公司 : 
		<td width="16%"><html:select property="company_name" onchange="showCompanyName(this.value)">
  			<option value=""></option>
           <html:options collection="list_company" property="company_id"  labelProperty="company_name"  />
		</html:select><html:errors property="company_name"/></td></tr>
		
			<tr><td width="16%" bgcolor="#dfdfdf">部門 : 
			<td width="16%"><select id="departname" name="departname">
			<option value="">         </option>
			</select></td></tr>
 

onchange後觸發showCompanyName函式編寫js指令碼。在指令碼中取公司下拉框的值，利用ajax將公司值傳給後臺AjaxGetInfo.java,從資料庫中查詢該公司下的部門。再返回json值，顯示到departname下拉框中。其中url的路徑返回值的資料都要匹配。

<script type="text/javascript">
function showCompanyName(obj)
{
   var id = obj;
  //var id = $(obj).val();
  var html = "<option value=\"0\" selected=\"selected\"> </option>"; 
    
   $("#departname").empty();
   $("#departname").append(html);
   $.ajax({
       type: "get",  
       url: "<%=path%>/AjaxGetInfo",  
       data: "company_id="+id,
       async: false,
      success: function(data){
       var jsonList=eval("("+data+")");
         var len = jsonList.length;
    //alert(jsonList);
         for(var i=0;i<len;i++){  
        var e = jsonList[i];  
        $("#departname").append("<option value="+e.id+">"+e.departname+"</option>");  
        }  
        }, 
    
});  
}
</script>
 

後臺查詢資料庫程式碼.java   網上很多是用xml檔案取數，一直也沒搞明白。一直想寫查詢資料庫取值的，找了好多，都是高手省略了改部分都貼出來，包括list轉換為json

package com.safe.struts.action;

import java.io.IOException;

import com.safe.struts.util.DB;
import com.safe.struts.util.Depart_company;
import java.io.PrintStream;
import java.sql.ResultSet;
import java.util.ArrayList;
import java.util.List;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;

import net.sf.json.JSONArray;
import com.google.gson.Gson;

public class AjaxGetInfo extends HttpServlet{
	public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

		doPost(request, response);
	}
	public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {	
	     String company_id = request.getParameter("company_id");
	     System.out.println("執行輸出--------"+company_id);
	     String json = null;
	    DB db = null;
	    try {       
	    			List list_depart =new ArrayList();
	    			//Map map = null;
	    			db = new DB();
	    			String sql_depart="select id,departname from department where company_id='" +company_id+ "'";
	    			System.out.println("部門名單是____"+sql_depart);
	    			db.connDb();
	    			ResultSet Rs=db.executeQuery(sql_depart);
	    			while(Rs.next()){
	    				//list_depart.add(Rs.getString(1));
	    				//map = new HashMap();
	    				//map.put("id",Rs.getInt(1));
	    				Depart_company  du=  new Depart_company();
	    				du.setId(Rs.getInt(1));
	    				du.setDepartname(Rs.getString(2));
	    				list_depart.add(du);
	    				}
	    			Rs = null;
	    			Gson gson = new Gson();
	    			json = gson.toJson(list_depart);
	    			System.out.println("json="+ json);	    			
	    			}
	    			catch(Exception e){
	    				
	    			}finally{
	    				if (db != null)
	    					db.closeDb();
	    		}
	    			response.setCharacterEncoding("utf-8");
	    			response.getWriter().print(json);
	  }
}
 

最後是web.xml配置

<servlet>  
    <servlet-name>AjaxGetInfo</servlet-name>     
    <servlet-class>com.safe.struts.action.AjaxGetInfo</servlet-class>  
  </servlet>  
  <servlet-mapping>  
    <servlet-name>AjaxGetInfo</servlet-name>  
    <url-pattern>/AjaxGetInfo</url-pattern>  
  </servlet-mapping>  
  <welcome-file-list>
  <welcome-file>adminadd.jsp</welcome-file>
  </welcome-file-list>

這其中還用到了jquery-1.8.3.min.js，大家可以從網上下載~