easyui datagrid 跨页选择

项目中遇到跨页选择(项目使用easyui):有多页数据,在当前页面选择后,下一页继续选择,返回之前页面时,仍然能记住之前选中的行。最后对多页选中的数据统一提交。

翻看easyui文档,官方并没有提供相应方法,easyui当前最新版本1.3.2也没有找到,最后使用了一个比较传统的方式,各位看官如果有更好的方式,劳烦告知,感激不尽。

声明全局数组变量

1 var ids = new Array();

使用easyui datagrid的四个方法处理

 1 onSelect:function(index,row){
 2 addItem(row.assetsId);
 3 },
 4 onUnselect:function(index,row){
 5 removeItem(row.assetsId)
 6 },
 7 onSelectAll:function(rows){
 8 addAll(rows);
 9 },
10 onUnselectAll:function(rows){
11 removeAll(rows);
12 },

对应处理函数

 1 //add onSelect
 2     function addItem(assetsId){
 3         var arrs = ids.join();
 4         console.info("arrs="+arrs);
 5         if(arrs.indexOf(assetsId) == -1){
 6             ids.push(assetsId);
 7         }
 8         console.info("ids="+ids);
 9     }
10     
11     //add current page
12     function addAll(rows){
13         for(var i=0; i<rows.length; i++){
14             var arrs = ids.join();
15             if(arrs.indexOf(rows[i].assetsId) == -1){
16                 ids.push(rows[i].assetsId);
17             }
18         }
19         console.info("addAll-ids="+ids);
20     }
21     
22     //remove unSelect
23     function removeItem(assetsId){
24         var arrs = ids.join();
25         console.info("arrs="+arrs);
26         var indexTmp = arrs.indexOf(assetsId);
27         console.info("index="+indexTmp);
28         if(indexTmp != -1){
29             for(var i=0; i<ids.length; i++){
30                 if(ids[i] == assetsId){
31                     ids.splice(i,1);
32                 }
33             }
34         }
35         console.info("ids="+ids);
36     }
37     
38     
39     //remove current page
40     function removeAll(rows){
41         for(var i=0; i<rows.length; i++){
42             var arrs = ids.join();
43             var indexTmp = arrs.indexOf(rows[i].assetsId);
44             if(indexTmp != -1){
45                 for(var j=0; j<ids.length; j++){
46                     if(ids[j] == rows[i].assetsId){
47                         ids.splice(j,1);
48                     }
49                 }
50             }
51         }
52         console.info("removeAll-ids="+ids);
53     }

返回之前页面后,显示已经选中的数据

 1 onLoadSuccess: function(){
 2             if(!ids){
 3                 return;
 4             }
 5             var myrows = $('#assetsTable').datagrid('getRows');
 6             for(var i=0; i<myrows.length; i++){
 7                 for(var j=0; j<ids.length; j++){
 8                     if(myrows[i].assetsId == ids[j]){
 9                         var index = $('#assetsTable').datagrid('getRowIndex',myrows[i]);
10                         $('#assetsTable').datagrid('selectRow',index);
11                     }
12                 }
13             }
14         },

数据提交时,直接提交ids即可,无需调用 datagrid 的 getSelections 方法,就算调用获取的数据也不完整。

原文地址:https://www.cnblogs.com/hanleytang/p/2862554.html