开发中经常遇到这种情况: 后台传一个集合到页面,我们需要遍历它,常见使用<c:foreach>进行, 对各个字段设置值。
那么对于radio这种怎么处理? 当然是是使用js来完成,该例子使用Jquery解决。
如下图一个超级简单的页面, 整理笔记的时候比较少,没来得及写个像样点的页面哈
一共有三个字段: 描述 备注 是否受理(boolean类型的,开发需求 需要使用radio在页面中显示)
解决思路如下
1. 使用<c:foreach item="${list}" var="ele">,我们可以获取到遍历的每一个元素
2. 给这些radio加上一个自定义属性,使其与每个元素的主键关联起来(即一个元素对应同一行的radio对)
3. 根据元素对象的字段,通过js, 设置radio是否选中
<c:forEach items="${list}" var="ele">
<tr>
<td>${ele.thedescribe}</td>
<td>${ele.remarks}</td>
<td>
<input data-tag="radio_${ele.id}" type="radio" value="0">否
<input data-tag="radio_${ele.id}" type="radio" value="1">是
</td>
</tr>
<script>
$(function () {
//注意,该js代码片段只能写在<c:foreach>里面,因为这里才有${ele}
if (${ele.state}) {
$("input[data-tag='radio_${ele.id}'][value='1']").attr("checked", true);
} else {
$("input[data-tag='radio_${ele.id}'][value='0']").attr("checked", true);
}
});
</script>
</c:forEach>