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
[code="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>



[/code]
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值