1. 程式人生 > >實現省市區三級聯動

實現省市區三級聯動

首先是js
$(document).ready(function(){
	getErpMarketByParentCode(0,'province',province);
	getErpMarketByParentCode(province,'city',city);
	getErpMarketByParentCode(city,'area',area);
	getErpMarketByParentCode(area,'market',market);
	$('#city').append($('<option>').val('').html('-請選擇-')).val('');
	$('#area').append($('<option>').val('').html('-請選擇-')).val('');
	if($('#market')){
		$('#market').append($('<option>').val('').html('-請選擇-')).val('');
	}
	$('#province').change(function(){
		if($(this).val() == ''){ // 請選擇
			$('#city').empty();
			$('#area').empty();
			$('#city').append($('<option>').val('').html('-請選擇-')).val('');
			$('#area').append($('<option>').val('').html('-請選擇-')).val('');
			if($('#market')){
				$('#market').empty();
				$('#market').append($('<option>').val('').html('-請選擇-')).val('');
			}
			return;
		}
		getErpMarketByParentCode($(this).val(),'city');
		$('#area').empty();
		$('#area').append($('<option>').val('').html('-請選擇-')).val('');
	});
	
	$('#city').change(function(){
		getErpMarketByParentCode($(this).val(),'area');
		if($('#market')){
			$('#market').empty();
			$('#market').append($('<option>').val('').html('-請選擇-')).val('');
		}
	});
	
	$('#area').change(function(){
		getErpMarketByParentCode($(this).val(),'market');
	});
});

function getErpMarketByParentCode(parentCode, id, value){
	$.ajax({   
	    url:'/getErpMarketByParentCode',   
	    type:'post',   
	    data:{
	    	code:parentCode
	    },   
	    dataType : 'json',
	    error:function(){   
	       alert('error');   
	    },   
	    success:function(data){   
	       var select = $('#' + id);
	       if(select){
	       	 select.empty();
		     select.append($('<option>').val('').html('-請選擇-'));
		     $.each(data.erpMarketList,function(i, erpMarket){
		       	select.append($('<option>').val(erpMarket.code).html(erpMarket.name));
		     });
		     select.val(value);
	       }
	    }
	});
}


然後是後臺方法
@RequestMapping(value = "/getErpMarketByParentCode")
	public ModelAndView getErpMarketByParentCode(HttpServletRequest request, HttpServletResponse response) throws Exception {
		String code = request.getParameter("code");
		List<ErpMarket> erpMarketList = erpMarketService.getErpMarketListByParentCode(code);
		JSONObject jsonObject = new JSONObject();
		jsonObject.put("erpMarketList",erpMarketList);
		response.getWriter().write(jsonObject.toString());
		return null;
	}

service方法,是從內從中獲取省市區這張表
public List<ErpMarket> getErpMarketListByParentCode(String parentCode){
		Hashtable erpMarketTable = LoadOnStartService.erpMarketTable;//從記憶體中獲取這張表
		List<ErpMarket> erpMarketList = new ArrayList<ErpMarket>();
		Iterator its = erpMarketTable.keySet().iterator();
		while(its.hasNext()){
			String key = Util.getString(its.next());
			ErpMarket erpMarket = (ErpMarket)erpMarketTable.get(key);
			if(parentCode.equals(erpMarket.getParentCode())){
				erpMarketList.add(erpMarket);
			}
		}
		return erpMarketList;
	}

省市區的實體類

package com.erp.entity;

/**
 * ErpMarket entity.
 * 
 * @author MyEclipse Persistence Tools
 */

public class ErpMarket implements java.io.Serializable {

	// Fields

	private String code;
	private String shortCode;
	private String name;
	private String level;
	private String parentCode;

	// Constructors

	/** default constructor */
	public ErpMarket() {
	}

	/** full constructor */
	public ErpMarket(String shortCode, String name, String level, String parentCode) {
		this.shortCode = shortCode;
		this.name = name;
		this.level = level;
		this.parentCode = parentCode;
	}

	// Property accessors

	public String getCode() {
		return this.code;
	}

	public void setCode(String code) {
		this.code = code;
	}

	public String getShortCode() {
		return this.shortCode;
	}

	public void setShortCode(String shortCode) {
		this.shortCode = shortCode;
	}

	public String getName() {
		return this.name;
	}

	public void setName(String name) {
		this.name = name;
	}

	public String getLevel() {
		return this.level;
	}

	public void setLevel(String level) {
		this.level = level;
	}

	public String getParentCode() {
		return this.parentCode;
	}

	public void setParentCode(String parentCode) {
		this.parentCode = parentCode;
	}

}