easyui datagrid 跨页选择
项目中遇到跨页选择(项目使用easyui):有多页数据,在当前页面选择后,下一页继续选择,返回之前页面时,仍然能记住之前选中的行。最后对多页选中的数据统一提交。
翻看easyui文档,官方并没有提供相应方法,easyui当前最新版本1.3.2也没有找到,最后使用了一个比较传统的方式,各位看官如果有更好的方式,劳烦告知,感激不尽。
声明全局数组变量
对应处理函数
返回之前页面后,显示已经选中的数据
数据提交时,直接提交ids即可,无需调用 datagrid 的 getSelections 方法,就算调用获取的数据也不完整。
项目中遇到跨页选择(项目使用easyui):有多页数据,在当前页面选择后,下一页继续选择,返回之前页面时,仍然能记住之前选中的行。最后对多页选中的数据统一提交。
翻看easyui文档,官方并没有提供相应方法,easyui当前最新版本1.3.2也没有找到,最后使用了一个比较传统的方式,各位看官如果有更好的方式,劳烦告知,感激不尽。
声明全局数组变量
var ids = new Array();
使用easyui datagrid的四个方法处理
onSelect:function(index,row){
addItem(row.assetsId);
},
onUnselect:function(index,row){
removeItem(row.assetsId)
},
onSelectAll:function(rows){
addAll(rows);
},
onUnselectAll:function(rows){
removeAll(rows);
},
对应处理函数
//add onSelect
function addItem(assetsId){
var arrs = ids.join();
console.info("arrs="+arrs);
if(arrs.indexOf(assetsId) == -1){
ids.push(assetsId);
}
console.info("ids="+ids);
}
//add current page
function addAll(rows){
for(var i=0; i<rows.length; i++){
var arrs = ids.join();
if(arrs.indexOf(rows[i].assetsId) == -1){
ids.push(rows[i].assetsId);
}
}
console.info("addAll-ids="+ids);
}
//remove unSelect
function removeItem(assetsId){
var arrs = ids.join();
console.info("arrs="+arrs);
var indexTmp = arrs.indexOf(assetsId);
console.info("index="+indexTmp);
if(indexTmp != -1){
for(var i=0; i<ids.length; i++){
if(ids[i] == assetsId){
ids.splice(i,1);
}
}
}
console.info("ids="+ids);
}
//remove current page
function removeAll(rows){
for(var i=0; i<rows.length; i++){
var arrs = ids.join();
var indexTmp = arrs.indexOf(rows[i].assetsId);
if(indexTmp != -1){
for(var j=0; j<ids.length; j++){
if(ids[j] == rows[i].assetsId){
ids.splice(j,1);
}
}
}
}
console.info("removeAll-ids="+ids);
}
返回之前页面后,显示已经选中的数据
onLoadSuccess: function(){
if(!ids){
return;
}
var myrows = $('#assetsTable').datagrid('getRows');
for(var i=0; i<myrows.length; i++){
for(var j=0; j<ids.length; j++){
if(myrows[i].assetsId == ids[j]){
var index = $('#assetsTable').datagrid('getRowIndex',myrows[i]);
$('#assetsTable').datagrid('selectRow',index);
}
}
}
},
数据提交时,直接提交ids即可,无需调用 datagrid 的 getSelections 方法,就算调用获取的数据也不完整。