下拉菜单连动效果的一种用法

页面js:

/**
 * 物料分类Json
 * {mainId:{
 * 		mainName, subJsonObject:{
 * 			subId:{subName, minJsonObject:{
 * 				minid:minName}}}}}
 */
var materialTypeInfoJson;
$(function(){
	//更改物料大分类获取对应中分类和小分类
	$("#mainTypeId").on("change", function(){
		var mainTypeId = $("#mainTypeId").val();
	 	var subTypeId = $("#subTypeId").val();
	 	var mainId = $("#subTypeId").find("[value='"+subTypeId+"']").attr("pater");
		if(mainTypeId != undefined && mainTypeId != ""){
			$("#subTypeId").children(":gt(0)").hide();
			$("#subTypeId").children("[pater='"+mainTypeId+"']").show();
			if(mainId != mainTypeId){
		 		$("#subTypeId").val("");
			}
		}else{
			$("#subTypeId").children().show();
			$("#subTypeId").val("")
		}
		$("#subTypeId").trigger("change");
	});
	//更改物料中分类获取对应大分类和小分类
	$("#subTypeId").on("change", function(){
	 	var subTypeId = $("#subTypeId").val();
	 	var minTypeId = $("#minTypeId").val();
	 	var subId = $("#minTypeId").find("[value='"+minTypeId+"']").attr("pater");
		$("#minTypeId").children(":gt(0)").hide();
	 	if(subTypeId != undefined && subTypeId != ""){
	 		var mainId = $("#subTypeId").find("[value='"+subTypeId+"']").attr("pater");
	 		$("#mainTypeId").val(mainId);
			$("#subTypeId").children(":gt(0)").not("[pater='"+mainId+"']").hide();
			$("#minTypeId").children("[pater='"+subTypeId+"']").show();
			if(subId != subTypeId){
				$("#minTypeId").val("");
			}
	 	}else{
	 		$("#subTypeId").children(":gt(0)").each(function(){
	 			var style = $(this).attr("style");
	 			if(/display: none;/.test(style)){
	 				return;
	 			};
	 			var subId_temp = $(this).val();
	 			$("#minTypeId").children("[pater='"+subId_temp+"']").show();
	 		});
			$("#minTypeId").val("");
	 	}
	});
	//更改物料小分类获取对应大分类和中分类
	$("#minTypeId").on("change", function(){
	 	var minTypeId = $("#minTypeId").val();
	 	if(minTypeId != undefined && minTypeId != ""){
	 		var subId = $("#minTypeId").find("[value='"+minTypeId+"']").attr("pater");
	 		$("#subTypeId").val(subId);
	 		$("#subTypeId").trigger("change");
	 	}
	});
	//获取物料分类Json
	if(materialTypeInfoJson == undefined || materialTypeInfoJson == ""){
		$.ajax({
			type : "post",
			url : contentPath + "/ajax/getMaterialTypeInfo.do",
			async : false,
			success : function(data) {
				materialTypeInfoJson = data;
			},
			dataType : "json"
		});
		drawSelectOption(materialTypeInfoJson);
	}
});
//根据传过来的参数，画物料分类下拉框选项
function drawSelectOption(jsonObj){
	var mainTypeSelect = $("#mainTypeId");
	var mainTypeId = mainTypeSelect.val();
	mainTypeSelect.empty();
	$("<option value>N/A</option>").appendTo(mainTypeSelect);
	var subTypeSelect = $("#subTypeId");
	var subTypeId = subTypeSelect.val();
	subTypeSelect.empty();
	$("<option value>N/A</option>").appendTo(subTypeSelect);
	var minTypeSelect = $("#minTypeId");
	var minTypeId = minTypeSelect.val();
	minTypeSelect.empty();
	$("<option value>N/A</option>").appendTo(minTypeSelect);
	$.each(jsonObj, function(k,v){
		var mainId = k;
		var mainName = v.mainName;
		var subJsonObject = v.subJsonObject;
		$("<option value=\""+mainId+"\">"+mainName+"</option>").appendTo(mainTypeSelect);
		$.each(subJsonObject, function(k,v){
			var subId = k;
			var subName = v.subName;
			var minJsonObject = v.minJsonObject;
			$("<option value=\""+subId+"\" pater=\""+mainId+"\">"+subName+"</option>").appendTo(subTypeSelect);
			if(minJsonObject == undefined){
				return;
			}
			$.each(minJsonObject, function(k,v){
				var minId = k;
				var minName = v.minName;
				$("<option value=\""+minId+"\" pater=\""+subId+"\">"+minName+"</option>").appendTo(minTypeSelect);
			});
		});
	});
	mainTypeSelect.val(mainTypeId);
	mainTypeSelect.trigger("change");
	subTypeSelect.val(subTypeId);
	subTypeSelect.trigger("change");
	minTypeSelect.val(minTypeId);
	minTypeSelect.trigger("change");
}

Action:

public class GetMaterialTypeInfoAction extends ERPSTDProxyAction{
	protected ActionForward doExecute(FormBean parameterFB, ActionMapping mapping, ActionForm form, 
			HttpServletRequest request, HttpServletResponse response)
			throws Exception {
		TableBean materialTypeTB = this.getERPServiceDelegation().getItemMasterService().getMaterialTypeInfo();
		JSONObject jsonObject = new JSONObject();
		JSONObject mainTypeJSONObject = null;//大分类
		JSONObject subTypeJSONObject = null;//中分类
		JSONObject subJsonObject = null;//中分类
		JSONObject minTypeJSONObject = null;//小分类
		JSONObject minJsonObject = null;//小分类
		for(int i = 0; i < materialTypeTB.size(); i ++){
			RowBean materialTypeRB = materialTypeTB.get(i);
			String mainId = materialTypeRB.getCellBeanValue("mainId");
			String mainName = materialTypeRB.getCellBeanValue("mainName");
			String subId = materialTypeRB.getCellBeanValue("subId");
			String subName = materialTypeRB.getCellBeanValue("subName");
			String minId = materialTypeRB.getCellBeanValue("minId");
			String minName = materialTypeRB.getCellBeanValue("minName");
			//处理大分类
			if(jsonObject.containsKey(mainId)){
				mainTypeJSONObject = jsonObject.getJSONObject(mainId);
			}else{
				mainTypeJSONObject = new JSONObject();
				mainTypeJSONObject.put("mainName", mainName);
				subJsonObject = new JSONObject();
			}
			//处理中分类
			if(subJsonObject.containsKey(subId)){
				subTypeJSONObject = subJsonObject.getJSONObject(subId);
			}else{
				subTypeJSONObject = new JSONObject();
				subTypeJSONObject.put("subName", subName);
				minJsonObject = new JSONObject();
			}
			//处理小分类
			minTypeJSONObject = new JSONObject();
			minTypeJSONObject.put("minName", minName);
			minJsonObject.put(minId, minTypeJSONObject);
			//json是用值传递，内容更改后需重新保存
			subTypeJSONObject.put("minJsonObject", minJsonObject);
			subJsonObject.put(subId, subTypeJSONObject);
			mainTypeJSONObject.put("subJsonObject", subJsonObject);
			jsonObject.put(mainId, mainTypeJSONObject);
		}
		PrintWriter pw = response.getWriter();
		pw.print(jsonObject.toString());
		pw.flush();
		return null;
	}
}