ajax,下拉框级联
js代码:
$(document).ready(function() { $("#type1").change(function(){ var type1Code=$("#type1").val(); $("#type2").empty(); if (type1Code!=0) { $.ajax({ type:'post', url:'getType2.action', data:'type1Code='+type1Code, dataType:'json', success:function(json){ if(null != json){ $("#type2").append("<option value=''>请选择二级类型</option>"); for(var i=0; i< json.type2List.length;i++){ $("#type2").append("<option value='" +json.type2List[i].type2Code+"'>" +json.type2List[i].type2Name+"</option>"); } } }, error:function(){ alert('取二级类型异常!'); } }); }else{ $("#type2").append("<option value=''>请选择二级类型</option>"); } });
jsp代码:
<td> 一级类型: </td> <td align="left"> <s:select id="type1" name="vo.type1" list="vo.type1List" headerKey="0" headerValue="请选择一级类型" listKey="code" listValue="name"></s:select> </td> <td> 二级类型: </td> <td align="left"> <select id="type2" name="vo.type2"> <option value=""> 请选择二级类型 </option> </select> </td>
struts.xml文件配置:
<package name="plan" extends="base-action" namespace="/plan"> <result-types> <result-type name="json" class="com.googlecode.jsonplugin.JSONResult" /> </result-types> <interceptors> <interceptor name="json" class="com.googlecode.jsonplugin.JSONResult" /> </interceptors> <action name="getType2" class="planUploadAction" method="getType2"> <interceptor-ref name="ebStackWithoutValidationAndToken" /> <result type="json"></result> <result name="input" type="chain">init</result> <result name="invalid.token" type="chain">init</result> <exception-mapping result="success" exception="java.lang.Exception" /> </action> 。。。。。。 </package>
对应action中的方法:
/** * 取二级类型 * @return */ public String getType2(){ try{ String type1Code=request.getParameter("type1Code"); String type2Code="type2_"+type1Code; List<HashMap<String, Object>> lit = new ArrayList<HashMap<String, Object>>(); JSONObject json = new JSONObject(); HashMap<String, Object> map = new HashMap<String, Object>(); //二级类别 List<SystemParamVO> type2List=sysParamTypeService.listParamByType(type2Code); for(SystemParamVO type2:type2List){ map = new HashMap<String, Object>(); map.put("type2Code", type2.getCode()); map.put("type2Name", type2.getName()); lit.add(map); } json.put("type2List", lit); response.setCharacterEncoding("UTF-8"); PrintWriter out = response.getWriter(); out.write(json.toString()); }catch (Exception e) { log.error(e.getMessage(), e); response.setStatus(500); } return null; }