网上有很多关于前端checkbox数据怎样传送给后台(action)的实例,但是很少有通过后台数据来控制前端checkbox的是否选中的例子,最近项目中就碰到这个问题
解决办法:
1、后台编写异步方法,获取value集合
public String returnCheckbox(){
//获取value集合
List<Integer> checklauser = serclassService.selectlsidBycid(cid);
JSONObject json = new JSONObject();
//放进json中
json.put("checkboxlist", checklauser.toString());
//将json返回到也main
returnJson(json.toString());
return "jsonresult";
}
2、前台编写异步方法
function getCheckbox(cid){
$.ajax({
type: "post",
url: "classification!returnCheckbox.action?cid="+cid,
async:true,
dataType: "json",
success: function(data){
//这个地方搞了好久,用split()页面上报split is not a function错误
//后面在国外的网站上建议 在字符串后面加 +'',然后问题就解决了 @zhangll
var str = data.checkboxlist+'';
//异步获取选中记录中包含的lsid分类集合,遍历集合,如果集合中的值与checkbox的value值相同,则选中
$(str.split(",")).each(function (i,dom){
$(":checkbox[value='"+dom+"']").prop("checked",true);
});
}
});
};
注:var str = data.checkboxlist+'',这里我在做这块的时候页面一直报 split not a function错误,加了这个单引号,就不会有这个问题了。
3、编写 jsp页面,这里的checkbox我是从后台的list中遍历出来的
<label id="label">
服务范围
</label>
<c:forEach var="lauserVo" items="${listlauserVo}" varStatus="status">
<input type="checkbox" name="checklauser" value="${lauserVo.lsid}" />${lauserVo.lsname}
<!--下面c:if标签可以控制每四个checkbox换行-->
<c:if test="${status.count % 4 == 0}">
<br/>
</c:if>
</c:forEach>
效果如下,勾选的value值全部是由后台传进来的