Jquery Ajax 提交 级联实现
页面代码<div> 省份：<select id="province"> <option value="">请选择省份</option> </select> 城市：<select id="city"> <option value="">请选择城市</option> </select></div>
级联菜单js代码
$(document).ready(function(){ var province=$("#province"); var city=$("#city"); var provinceurl="/Struts2/base/selectProvince.action"; $.post(provinceurl,{code:"province"},function(data){ var dataObj=eval("("+data+")"); $.each(dataObj,function(index,item){ var tempOption = document.createElement("option"); tempOption.value = item.provinceId; tempOption.innerHTML= item.provinceName; province.append(tempOption); }); },"json"); province.change(function(){ city.empty(); var params={provinceCode:$('#province option:selected').val()}; $.post("/Struts2/base/selectCity.action",params,function(data){ alert(data); var dataObj=eval("("+data+")"); //转换为json对象 $.each(dataObj,function(index,item){ var tempOption = document.createElement("option"); tempOption.value = item.cityId; tempOption.innerHTML= item.cityName; city.append(tempOption); }); },"json"); }); });
Action
ackage com.hyts.business.action;import java.util.List;import javax.servlet.http.HttpServletRequest;import net.sf.json.JSONArray;import com.hyts.dao.ProvinceDAO;import com.hyts.model.City;import com.hyts.model.Province;import com.opensymphony.xwork2.ActionSupport;public class ChainSelectAction extends ActionSupport { private static final long serialVersionUID = 1383189653446960523L; private HttpServletRequest request; private String result;//前台接收数据 private String provinceCode; public String selectProvince(){ProvinceDAO provinceDAO=new ProvinceDAO();List<Province> list=provinceDAO.getAllProvince();JSONArray jsonArray2 = JSONArray.fromObject( list ); this.result=jsonArray2.toString();return SUCCESS; } public String selectCity() throws Exception{ProvinceDAO provinceDAO=new ProvinceDAO();System.out.println(this.provinceCode);int provinceId=Integer.parseInt(this.provinceCode);List<City> list=provinceDAO.getCityByProvince(provinceId);for(int i=0;i<list.size();i++){ City city=list.get(i); System.out.println(city.getCityName());}JSONArray jsonArray = JSONArray.fromObject( list );this.result=jsonArray.toString();return SUCCESS; } public String getResult() {return result; } public void setResult(String result) {this.result = result; }public String getProvinceCode() {return provinceCode; } public void setProvinceCode(String provinceCode) {this.provinceCode = provinceCode; } public void setServletRequest(HttpServletRequest request) {this.request=request; }}Struts.xml<?xml version="1.0" encoding="UTF-8" ?><!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.0//EN" "http://struts.apache.org/dtds/struts-2.0.dtd"><struts><include file="struts-default.xml"/><package name="/base" extends="json-default" namespace="/base"><action name="selectProvince" class="com.hyts.business.action.ChainSelectAction" method="selectProvince"> <result type="json"> <param name="root">result</param> </result></action> <action name="selectCity" class="com.hyts.business.action.ChainSelectAction" method="selectCity"> <result type="json"> <param name="root">result</param> </result></action> </package></struts>
页:
[1]