JSP頁面代碼: <script type="text/javascript"> $(function(){ $("#language_tm2008").change(function(){ var company = $("#language_tm2008").val(); $.ajax({ type:"POST", url :"<%=basePath %>view/report/getDepart.do", data:{ companyId:company }, dataType:"json", success:function(data){ $("#language_tm2009").empty(); $("#language_tm2009").append("<option value=''>----選擇申請部門----</option>"); $.each(data.tasks,function(index,item){ $("#language_tm2009").append( "<option value='"+item.id+"'>"+item.name+"</option>"); }); } }); }); }); </script> 第一級公司是固定的 <select name="search_EQ_department_c" class="sel_hei" id="language_tm2008"> <option value="">選擇申請公司</option> <option value="4028805120f505f90120f54ca9320047">省公司</option> <option value="4028805120f505f90120f54ca9320046">地市</option> </select> 第二級部門 <select name="search_EQ_department_d" class="sel_hei" id="language_tm2009"> <option value="">----選擇申請部門----</option> </select>
後臺代碼:javascript
@RequestMapping(value="/getDepart") public @ResponseBody Map<String,Object> getDepartment(String companyId){ //得到部門列表 List<Department> departmentList = this.commonReportService.getApplyDepart(companyId); Map<String,Object> jsonMap = new HashMap<String, Object>(); List list = null; if(null != departmentList && departmentList.size()>0){ list = new ArrayList(); for(Department depart : departmentList){ Map<String,String> taskMap=new HashMap<String,String>(); taskMap.put("id", depart.getId()); taskMap.put("name", depart.getName()); list.add(taskMap); } } jsonMap.put("tasks", list); return jsonMap; }
JSP頁面提交form表單後,返回到當前頁面的時候,咱們要求仍是提交前的查詢條件,那麼就要從後臺返回一個二級菜單的列表 和 提交前的 查詢條件。java
<select name="search_EQ_department_d" class="sel_hei" id="language_tm2009"> <option value="">----選擇申請部門----</option> <c:if test="${departmentList!=null && fn:length(departmentList)>0}"> <c:forEach items="${departmentList}" var="depart" varStatus="go"> <option value="${depart.id}" <c:if test="${depart.id == searchParams['EQ_department_d']}">selected="selected"</c:if> >${depart.name}</option> </c:forEach> </c:if> </select>
這樣就能夠了。
ajax