jsp页面
<td width="7%" align="right" style="padding-top:10px;">市区代码</td> <td width="10%" style="padding-top:10px;"> <select class="main_select" name="headPageInfo.cityCode" id="headPageInfocityCode" οnchange="changeCity(this.value)"> <option value="0">--请选择--</option> <s:iterator value="cityDic" status="city" id="city"> <option value="<s:property value='cityCode'/>"> <s:property value="cityName" /> </option> </s:iterator> </select> </td> <td width="7%" align="right" style="padding-top:10px;">社区代码</td> <td width="10%" style="padding-top:10px;"> <select class="main_select" name="headPageInfo.belongCode" id="belongCode"> <%-- <option value="0">--请选择--</option> <s:iterator value="cityDic" status="city" id="city"> <option value="<s:property value='cityCode'/>"> <s:property value="cityName" /> </option> </s:iterator> --%> </select> </td>
js方法
//市区代码,社区代码级联 function changeCity(selectedCity){ //alert(selectedCity); $("#headPageInfocityCode").val(selectedCity); if(selectedCity=="0"){ $("#belongCode").html(""); return; } $("#belongCode").html(""); var sbelongCode=$("#belongCode"); sbelongCode.append('<option value="0">--请选择--</option>'); //异步请求查询sbelongCode列表的方法并返回json数组 $.ajax({ url : '/headpage/headpage!getBelongCode.htm', type : 'post', data : { citycode : selectedCity }, dataType : 'json', success : function (opts) { // 单选CI if (opts && opts.length > 0) { var html = []; for (var i = 0; i < opts.length; i++) { html.push('<option value="'+opts[i].value+'">'+opts[i].text+'</option>'); } sbelongCode.append(html.join('')); } } }); }
后台方法
public void getBelongCode(){ try { String citycode=this.getRequest().getParameter("citycode"); List<OptionBean> list=headpageService.getBelongCodes(citycode); JSONArray array=JSONArray.fromObject(list); this.getResponse().getWriter().append(array.toString()); } catch (IOException e) { e.printStackTrace(); } }
注:
将list集合转成json数组时要导入import net.sf.json.JSONArray;