您的位置:首页 > Web前端 > JavaScript

jsp页面带有多选框的grid表格,如何将勾选中的行记录所有列数据传送到后台。

2017-09-18 13:58 483 查看
1.本方案大体思路是,将选中元素所在行的数据,拼装成一个js对象,然后使用JSON.stringify方法将对象转换为json字符串,以ajax.post的方式发送给后台,然后在server端用GsonUtils转为List

<table >
<thead >
<tr>
<th ><input type="checkbox" name="checked-all" class="checkbox checked-all"></th>
<th >编码</th>
<th >名称</th>
<th >启用状态</th>
<th >操作</th>
</tr>
</thead>
<tbody>
<c:forEach >
<tr >
<td><input type="checkbox" name="itemId" value="${it.id}" class="checkbox"></td>
<td><c:out value="${it.code}" /><input type="hidden" name="code" value="${it.code}" ></td>
</span> <input type="text"  name="name" value="<c:out value="${it.name}"/>" maxlength="50" ></td>
</tr>
</c:forEach>
</tbody>
</table>


3、js代码部分

//选中后点击按钮从该方法开始执行

//按钮如下jsp代码:

<a href="javascript:void(0);" onclick="deleteFun('itemId', del,'itemId,code,name');" class="del-pl"><i class="cedu-delete mr10"></i>删除</a>


js代码:

function deleteFun(tag, callback, needCollectValue) {
var str = makeValuesToArray(tag, needCollectValue);
if (str == "[]") {
alert("请选择要删除的数据项!");
return false;
}
if (confirm('您确定要删除选取的项吗?')) {
callback(str);
return true;
}
return false;
}

function makeValuesToArray(tag, needCollectValue) {
var str = "";
var idx = 0;
var arr = new Array();
$("input[name='" + tag + "']:checked").each(function(index, o) {
//每行
var obj = {};
$(this).parents('tr:first').find('input').each(function(i, e) {
//行中的每个元素
var nameVal = $(e).attr('name');
if (needCollectValue.indexOf(nameVal) >= 0) {
obj[nameVal] = $(e).val();
}
});
arr[index] = obj;
});
str = JSON.stringify(arr)
return str;
}

//向后台发送ajax请求
function del(jsonStr) {
ajaxSubmit({
url : "${path}management/career/projectcategory/delete.do",
params : {
delJsonData : jsonStr
},
onSuccess : function(data, textStatus) {

},
onError : function(req) {

}
});
}


4、java代码部分

List<HashMap<String, String>> list = GsonUtils.fromJson(delJsonData, new TypeToken<List<HashMap<String, String>>>() {
});


这样就可以将前台列表的选中数据,封装到后台service段的list对象里面了。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐