jquery ajax array checkbox action

直接使用jquery的$.ajax()异步提交时,如果data中含有Array(如提交checkbox时),action不能直接使用List接收array。

html:
<input type="checkbox" name="id" value="1">
<input type="checkbox" name="id" value="2">
<input type="checkbox" name="id" value="13">
<input type="checkbox" name="id" value="14">

js:
$("input[type='checkbox'][name='id']:checked").each(function(){
id.push($(this).val());

});
$.ajax({
type:"post",
url:"teacherDisable.action",
dataType:"json",
success:function(data){
if(data.success == true){
alert(data.message);
window.location.reload();
}else{
alert(data.message);
}
},
data:{id:id}
});
浏览器显示提交数据:
参数application/x-www-form-urlencoded
id[] 13
id[] 14
源代码
id%5B%5D=13&id%5B%5D=14
但是后台接收变量List<Integer> id为空

解决方案
1:data:{id:id}改为data:$.param({id:id},true),对参数进行序列化
2:改变js接收id的方法,将id转化为字符串
$("input[type='checkbox'][name='id']:checked").each(function(){
id += "id=" + $(this).val() + "&";
});
3:改变html中checkbox的name
<input type="checkbox" name="id[0]" value="1">
<input type="checkbox" name="id[1]" value="2">
<input type="checkbox" name="id[2]" value="13">
<input type="checkbox" name="id[3]" value="14">

$.ajax()改为简洁的$.post():
$.post("teacherDisable.action",$("input[type='checkbox']:checked"),function(data){
if(data.success == true){
alert(data.message);
window.location.reload();
}else{
alert(data.message);
}
});

三种方法都可以使action通过set()方法获取参数,第一种最为方便,对参数进行序列化即可,第二种方法比较简陋,将checkbox的值拼装为字符串,第三种需要更改html中checkbox的name,而且如果只选中id[3],那么后台得到的是一个长度为4的List,其中0~2为null,只有第三个有值
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值