您的位置:首页 > 其它

服务端做分页,分页多选,数据回显,动态修改

2017-10-14 12:48 696 查看
参考思路    http://blog.csdn.net/lxhjava/article/details/54633829




<script type="text/javascript">
$(document).ready(function() {
var checkedIds = parent.$("#checkedIds").val();//获取父页面数据
if(checkedIds.length != 0){     //判断如果为空跳过
var ids = new Array(); //定义一数组
ids = checkedIds.split(";");
for(var i in ids){
if(ids[i].length == 0){
continue ;
}
var arr = JSON.parse(ids[i]);
$("#"+arr.id).attr("checked", true);
$("#"+arr.id).parent().next().find('input').val(arr.inDis);     //赋值
$("#"+arr.id).parent().next().next().find('input').val(arr.number);
}
}
});

</script>


<script>
//跨页多选
function updateCheckedIds(box){
//获得当前复选框的值
var id=box.value;
var inDis = $(box).parent().next().find('input').val();
var number = $(box).parent().next().next().find('input').val();
var arr = {
'id' : id,
'inDis' : inDis,
'number' : number
}
//历史所选的id,多个id以";"分隔
var checkedIds = parent.$('#checkedIds').val(); //获取父页面数据
if(box.checked){//勾选
checkedIds += JSON.stringify(arr)+";";//历史用没有则追加
parent.$('#checkedIds').val(checkedIds);
}else{//取消勾选
var ids = new Array(); //定义一数组
ids = checkedIds.split(";");
var a = "";
for(var i in ids){   //遍历数组
if(ids[i].length == 0){
continue ;
}
var old = JSON.parse(ids[i]);   //字符串转换为json对象(数组)
if(id != old.id ){   //不存在
a += JSON.stringify(old)+";";
} else {
$(box).parent().next().find('input').val("");
$(box).parent().next().next().find('input').val("");
}
}
parent.$('#checkedIds').val(a);   //修改完成保存返回
}
}
//折扣焦点事件(动态变更数据)
function inDisAnd (box){
var inDis = box.value;      //已经修改的值
var id = $(box).parent().prev().find('input').val();     //得到该对象id
var checkedIds = parent.$("#checkedIds").val();     //获取父页面数据
if(checkedIds.length == 0){     //判断如果为空跳过
return ;
}
var ids = new Array(); //定义一数组
ids = checkedIds.split(";");
var a = "" ;
for(var i in ids){
if(ids[i].length == 0){
continue ;
}
var arr = JSON.parse(ids[i]);
if(id == arr.id ){
arr.inDis = inDis ;
}
a += JSON.stringify(arr)+";";
}
parent.$('#checkedIds').val(a);   //修改完成保存返回
}
//数量焦点事件(动态变更数据)
function numberAnd (box){
var number = box.value;      //已经修改的值
var id = $(box).parent().prev().prev().find('input').val();     //得到该对象id
var checkedIds = parent.$("#checkedIds").val();     //获取父页面数据
if(checkedIds.length == 0){     //判断如果为空跳过
return ;
}
var ids = new Array(); //定义一数组
ids = checkedIds.split(";");
var a = "" ;
for(var i in ids){
if(ids[i].length == 0){
continue ;
}
var arr = JSON.parse(ids[i]);
if(id == arr.id ){
arr.number = number ;
}
a += JSON.stringify(arr)+";";
}
parent.$('#checkedIds').val(a);   //修改完成保存返回
}
//查看已选(相当于排序)
//    function showSelect() {
//        var checkedIds = parent.$("#checkedIds").val();     //获取父页面数据
//    }
/*关闭弹出框口*/
function layer_close() {
var index = parent.layer.getFrameIndex(window.name);
parent.layer.close(index);
}
</script>


<tbody>
<c:forEach items="${page.list}" var="teachingMaterial">
<tr>
<td><input type="checkbox" id="${teachingMaterial.id}" value="${teachingMaterial.id}"
name="id[]" onclick="updateCheckedIds(this)" class="checkboxs"/>
</td>
<td id="inDis"><input style="width:80%;" onblur="inDisAnd(this)" /></td>
<td id="number"><input  style="width:80%;" onblur="numberAnd(this)"/></td>
<td>${teachingMaterial.name}</td>
<td>${teachingMaterial.versionOf}</td>
<td>${teachingMaterial.price}</td>
<td>${teachingMaterial.sort}</td>
<td>${teachingMaterial.printing}</td>
<td>${teachingMaterial.code}</td>
<td>${teachingMaterial.isbn}</td>
</tr>
</c:forEach>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: