三级联动

最新推荐文章于 2019-04-16 20:22:49 发布

原创最新推荐文章于 2019-04-16 20:22:49 发布 · 120 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#三级联动

web 专栏收录该内容

5 篇文章

订阅专栏

1、页面信息

#if($!showSwitch == "testFirst")
		                        <div class="form-group mno">
								    <label for="projectLineId" class="col-sm-1 control-label" style="text-align:left;">研发部</label>
								    <div class="col-sm-3" >
								    	<select class="form-control" id="projectDept" name="" style="width:275px;" onchange="setSystem()">
									  		#foreach($projectDept in $projectDepts )
												<option #if($project.projectLineId  == $projectDept.id) selected="selected" #end value="$projectDept.code" >$projectDept.name</option>
											#end
										</select>
								    </div>
							  	</div>
		                        <div class="form-group mno">
								    <label for="projectLineId" class="col-sm-1 control-label" style="text-align:left;">选择系统</label>
								    <span style="color:red;margin-left:-5px;">*</span>
								    <div class="col-sm-3" >
								    	<select class="form-control" id="system"  onchange="setComponent();" name="system"  style="width:275px;">
								    		<option  value="" >请选择</option>
								    		#foreach($system in $systems )
												<option  value="$!system.systemId" >$!system.system</option>
											#end	
										</select>
										<span style="color:red;display: none;float: left" id="showSystemMessage">上面的部门没有对应的系统</span>
								    </div>
							  	</div>
							  	<div class="form-group mno">
								    <label for="projectLineId" class="col-sm-1 control-label" style="text-align:left;">选择应用</label>
								    <span style="color:red;margin-left:-5px;">*</span>
								    <div class="col-sm-3" >
								    	<select class="form-control" id="component" name="component" style="width:275px;" onchange="setComponentUser()"> 
												<option  value="$!systemApp.appId" >$!systemApp.appName</option>
										</select>
										<span style="color:red;display: none;float: left;" id="showComponentMessage">上面的系统没有对应的应用</span>
								    </div>
							  	</div>
							  	<div class="form-group mno">
		                            <label for="inputPassword3" class="col-sm-1 control-label" style="text-align:left;">应用责任人</label>
		                            <div class="col-sm-3">
		                            	<input readonly="readonly" class="form-control" style="width:275px;" placeholder="请选择应用，不要自己填写" value=""  rows="5" id="componentUser" name="componentUser" />
		                            </div>
		                        </div>
		                    #end

2、ajax

//当【部门】变化时，设置与之对应的所有的【系统】的值
		function setSystem(){
			var deptCode = $("#projectDept").val();
			
			$.ajax({
			     type :'get',
			     url: "${appRoot}/system/getSystemAjax.do?deptCode="+deptCode,
			     async:false,
			     dataType: 'json',
			     success: function (packJson) {
			         $("#system").empty();
			         $("#component").empty();
			         $("#componentUser").val("");
			         $('<option value="">'+"请选择"+'</option>').appendTo($("#system"));
			         if(packJson.length == 0){
			        	 $("#showSystemMessage").show();
			         }else{
			        	 $("#showSystemMessage").hide();
			         }
			         for(var i = 0; i < packJson.length; i++){
						$('<option value="' + packJson[i].system_id + '">' + packJson[i].system + '</option>').appendTo($("#system"));
			        }
				 }
			});
		}
		
		//当【系统】变化时，设置所有的、对应的 【应用】
		function setComponent(){
			var systemId = $("#system").val();
			$.ajax({
			     type :'get',
			     url: "${appRoot}/component/getComponentAjax.do?systemId="+systemId,
			     async:false,
			     dataType: 'json',
			     success: function (packJson) {
			         $("#component").empty();
			         $("#componentUser").val("");
			         $('<option value="">'+"请选择"+'</option>').appendTo($("#component"));
			         if(packJson.length == 0){
			        	 $("#showComponentMessage").show();
			         }else{
			        	 $("#showComponentMessage").hide();
			         }
			         for(var i = 0; i < packJson.length; i++){
			        	 $('<option value="' + packJson[i].appId + '">' + packJson[i].appName + '</option>').appendTo($("#component"));
			        }
				 }
			});
		}
	
		//当【应用】变化时，设置对应的【应用负责人】  //要求：appName唯一
		function setComponentUser(){
			var appName = $("#component").val();
			$.ajax({
			     type :'get',
			     url: "${appRoot}/component/getComponentUserByAppName.do?appName="+appName,
			     async:false,
			     dataType: 'text',
			     success: function (data) {
			    	 $("#componentUser").val("");
			    	 $("#componentUser").val(data);
				 }
			});
		}

3、Controller

@RequestMapping(value = "/system/getSystemAjax.do",method = RequestMethod.GET)
	public void getSystemsByDeptCode(String deptCode,Model model,HttpServletResponse response) throws IOException{
		if (logger.isInfoEnabled()) {
			logger.info("getSystemsByDeptCode(Model model=" + model + ",String deptCode="+deptCode+") -  start ");
		}
		response.setContentType("application/json;charset=UTF-8"); 
		response.setCharacterEncoding("UTF-8"); 
		PrintWriter out = response.getWriter();
		if(deptCode.equals("0009") || deptCode.equals("0010")){
			deptCode = "0004";
		}
		List<PmpOnlineSystem> lists = onlineSystemBiz.findSystemsByDeptCode(deptCode);
		String responseStr = "[";
		boolean first = true;
		for(PmpOnlineSystem line:lists){
			if(first){
				first = false;
			} else {
				responseStr += ",";
			}
			responseStr += "{\"id\":\"" + line.getId() + "\","+"\"system\":\""+line.getSystem()+"\","+"\"system_id\":\""+line.getSystemId()+"\"}";
		}
		responseStr += "]";
		out.write(responseStr);
		
		if (logger.isInfoEnabled()) {
			logger.info("getComponentsBySystemId(Model model=" + model
					+ ") -  end  - return value=line_create");
		}
	}

@RequestMapping(value = "/component/getComponentAjax.do",method = RequestMethod.GET)
	public void getComponentsBySystemId(Integer systemId,Model model,HttpServletResponse response) throws IOException{
		if (logger.isInfoEnabled()) {
			logger.info("getComponentsBySystemId(Model model=" + model +",Integer systemId="+systemId+ 
					", HttpServletResponse response="+response+") -  start ");
		}
		response.setContentType("application/json;charset=UTF-8"); 
		response.setCharacterEncoding("UTF-8"); 
		PrintWriter out = response.getWriter();
		
		List<PmpSystemApp> lists = systemAppBiz.findComponentsBySystemId(systemId);
		String responseStr = "[";
		boolean first = true;
		for(PmpSystemApp line:lists){
			if(first){
				first = false;
			} else {
				responseStr += ",";
			}
			responseStr += "{\"appName\":\"" + line.getAppName() + "\","+"\"componentUser\":\""+line.getAppPerson()+"\","+"\"appId\":\"" + line.getAppId()+"\"}";
		}
		responseStr += "]";
		out.write(responseStr);
		
		if (logger.isInfoEnabled()) {
			logger.info("getComponentsBySystemId(Model model=" + model +",Integer systemId="+systemId+ 
					", HttpServletResponse response="+response+") -  end ");
		}
	}

@RequestMapping(value = "/component/getComponentUserByAppName.do",method = RequestMethod.GET)
	public void getComponentUserByAppName(String appName,Model model,HttpServletResponse response) throws IOException{
		if (logger.isInfoEnabled()) {
			logger.info("getComponentUserByAppName(Model model=" + model + ",String appName="+appName+
					",HttpServletResponse response="+response+") -  start ");
		}
		response.setContentType("application/json;charset=UTF-8"); 
		response.setCharacterEncoding("UTF-8"); 
		PrintWriter out = response.getWriter();
		
		String compUser = systemAppBiz.findComponentUserByAppName(appName);
		if(compUser!=null){
			out.write(compUser);
		}else{
			out.write("");
		}
		
		if (logger.isInfoEnabled()) {
			logger.info("getComponentUserByAppName(Model model=" + model + ",String appName="+appName+
					",HttpServletResponse response="+response+") -  end ");
		}
	}