Easyui呼叫資料庫實現省市縣區三級聯動的效果如果下

1、首先要設計資料庫，如圖所示。一個有4個欄位code，note，pycode。code：行政區劃程式碼，note：中文註釋，pycode：拼音縮寫。 其中code是由6個欄位組成。如果是省級最後4位是0000，如果是地級市最後2位是00，其他是縣區。 

我已經把相關資料庫程式碼上傳到我的csdn資源中，需要的同學自行下載。

2、我用的是java、SSH框架結合Easyui控制元件

3、html程式碼如下

          <tr>                                                             
             <td class="left">省:</td>   
             <td><input name="contact.province"  id="province" style="width: 174px;" ></td>         
             <td class="left">市:</td>                    
             <td><input   name="contact.city" id="city" style="width: 174px;"></td>                                             
             <td class="left">縣區:</td>   
             <td><input name="contact.county"  id="county" style="width: 174px;" ></td>
        </tr>
 

$(function(){
	
	// 下拉框選擇控制元件，下拉框的內容是動態查詢資料庫資訊
 	$('#province').combobox({ 
			    url:'apply/provinceCombobox_combobox.action',
			    editable:false, //不可編輯狀態
			    cache: false,
			   // panelHeight: 'auto',//自動高度適合
			    valueField:'code',   
			    textField:'note',
			    
 	onHidePanel: function(){

		    $("#city").combobox("setValue",'');
		    $("#county").combobox("setValue",'');
		    $("#cregicounty").val('');
			var province = $('#province').combobox('getValue');		
			if(province!=''){
			$.ajax({
				type: "POST",
				url: "apply/cityCombobox_combobox.action?province="+province,
				cache: false,
				dataType : "json",
				success: function(data){
				$("#city").combobox("loadData",data);
		                               }
	                               }); 	
                           }
                     } 
                 }); 
	
	$('#city').combobox({ 

	    editable:false, //不可編輯狀態
	    cache: false,
	    //panelHeight: 'auto',//自動高度適合
	    valueField:'code',   
	    textField:'note',
	    onHidePanel: function(){
	    	$("#cregicounty").val('');
		    $("#county").combobox("setValue",'');
			var city = $('#city').combobox('getValue');		
			if(city!=''){
			$.ajax({
				type: "POST",
				url: "apply/countyCombobox_combobox.action?city="+city,
				cache: false,
				dataType : "json",
				success: function(data){
				$("#county").combobox("loadData",data);
		                               }
	                               }); 	
                           }
                     }
	   });  
	$('#county').combobox({ 
	    editable:false, //不可編輯狀態
	    cache: false,
	   // panelHeight: 'auto',//自動高度適合
	    valueField:'code',   
	    textField:'note',
	    onHidePanel: function(){
         var str=$('#county').combobox('getText');
		    $("#cregicounty").val(str);	
                     }
	 });  
  
   $('#country').combobox({//國家程式碼初始化 
		valueField:'english',   
	    textField:'note',
	    url:'json/country.json',
	    cache: false,
	   //panelHeight: 'auto',//自動高度適合
	    onChange: function(newValue,oldValue){	

	    	countrySearch(newValue);
	    	countrys(newValue);
	    }
	});
});
 

	//查詢全國行政區程式碼省
	public String provinceCombobox() throws Exception{
		
		List list=comboboxService.findProvince();
		this.jsonUtil(list);
		return null;
	}
	
	//查詢全國行政區程式碼市
	public String cityCombobox() throws Exception{
			
		List list=comboboxService.findCity(province);
		this.jsonUtil(list);
	    return null;
	}
		
	//查詢全國行政區程式碼縣區
	public String countyCombobox() throws Exception{
		
		List list=comboboxService.findCounty(city);
		this.jsonUtil(list);
	    return null;
	}
	
	
	//呼叫json工具方法，傳入引數alist
	public void jsonUtil(Object accountlist) throws Exception{
			HttpServletResponse response = ServletActionContext.getResponse();		
			log.info("JSON格式：" + accountlist.toString());
			
			String returnJson = JsonConvert.returnJson(accountlist);
			response.setCharacterEncoding("utf-8");
			response.getWriter().println(returnJson);
		}
 

6、工具JSON程式碼

import java.io.StringWriter;

import org.codehaus.jackson.map.ObjectMapper;

public class JsonConvert {
	static String jsonStr;
	public static String returnJson(Object object) throws Exception{
		ObjectMapper objectMapper = new ObjectMapper();
		StringWriter stringWriter = new StringWriter();
		objectMapper.writeValue(stringWriter, object);
		
		jsonStr = stringWriter.toString();
		return jsonStr;
	}
}

	//查詢省
	public List findProvince() throws Exception;
	
	//查詢市
	public List findCity(String code) throws Exception;
	
	//查詢縣區
	public List findCounty(String code) throws Exception;

	//下拉框--查詢省
	public List findProvince()  {
		log.info("===下拉框--查詢省");

		Criteria criteria=this.sessionFactory.getCurrentSession().createCriteria(CareacodeTblQg.class);
		criteria.add(Restrictions.like("code", "%0000"));
		criteria.addOrder(Order.asc("code"));
		
		return criteria.list();
	}
	
	//下拉框--查詢市
	public List findCity(String code2)  {
		log.info("===下拉框--查詢市");
		String id=code2.substring(0,2);

		Criteria criteria=this.sessionFactory.getCurrentSession().createCriteria(CareacodeTblQg.class);
		criteria.add(Restrictions.like("code", id+"%00"));
		criteria.add(Restrictions.ne("code",code2 ));
		criteria.addOrder(Order.asc("code"));
		
		return criteria.list();
	}
		
	//下拉框--查詢縣區
	public List findCounty(String code3)  {
		log.info("===下拉框--查詢縣區");

		String id=code3.substring(0,4);
		Criteria criteria=this.sessionFactory.getCurrentSession().createCriteria(CareacodeTblQg.class);	
		
		criteria.add(Restrictions.like("code", id+"%"));
		criteria.add(Restrictions.not(Restrictions.like("code", "%01")));
		criteria.add(Restrictions.ne("code",code3 ));
		criteria.addOrder(Order.asc("code"));
		
		return criteria.list();
		}