• Ext grid checkbox 分页 翻页 勾选 问题


     1          timeArray = new Array();    //临时数组变量
     2     var timeStatusBar = new Ext.ux.StatusBar({
     3             id: 'statusbar',
     4             defaultText: '选择时间列表',
     5     });     
     6     var timeSelectModel = new Ext.grid.CheckboxSelectionModel({
     7         checkOnly:true,
     8         singleSelect:false,
     9         listeners:{
    10             rowselect:function(sm, rowIndex, record){  //选择事件,将time添加到timeArray中
    11                 var time = record.data.time;                
    12                 if (!ArrayContains(timeArray, time)){
    13                 //timeArray中没有存储time,则添加到timeArray中
    14                     var link = '<a href="javascript:removeTime_result('+time+')"><img src="/NetMonitor/Images/common/delete.gif"/></a>';
    15                     ArrayAppendDesc(timeArray, time, [time, link]);
    16                     timeStore_result.loadData(timeArray);                    
    17                 }
    18                 
    19             },
    20             rowdeselect:function(sm, rowIndex, record){  //取消选择事件,从timeArray中移除出去
    21                 //临时变量中存储了这个time,则从timeArray中移除出去
    22                 var time = record.data.time;            
    23                 ArrayRemove(timeArray, time);
    24                 timeStore_result.loadData(timeArray);                
    25             }
    26         }
    27     });
    28     var timeColumnModel = new Ext.grid.ColumnModel([
    29         {  header:'时间选择列表',dataIndex:'time',200,align:'center'},
    30         timeSelectModel
    31     ]);
    32     var timeRecordType = Ext.data.Record.create([{name:'time'}]);
    33     var timeStore = new Ext.data.Store({
    34         id:'timeStore',
    35         proxy:new Ext.data.DWRProxy(ExcelDaoService.getGridTime_ExcelDao,false),
    36         reader:new Ext.data.ListRangeReader({
    37             root:'data',
    38             totalProperty:'totalSize'
    39         },timeRecordType)
    40         ,
    41         listeners:{
    42             beforeload:function(){
    43                 timeStore.baseParams = {table:table};    
    44             },
    45             load:function(){                                        //加载的时候,根据临时变量timeArray勾选
    46                 var records = new Array();
    47                 timeStore.each(function(record){
    48                     for(var i=0; i<timeArray.length; i++){
    49                         if(timeArray[i][0] == record.data.time){
    50                             records.push(record);
    51                         }                        
    52                     }
    53                 });            
    54                 timeSelectModel.selectRecords(records, true);
    55             }
    56         },
    57         remoteSort:true
    58     });
    59 
    60     var pageTBar=new Ext.PagingToolbar({
    61         id:'pagingTbr',
    62         pageSize: 20,
    63         store:timeStore,
    64         afterPageText:'共{0}页',
    65         beforePageText:"当前页",
    66         lastText:"尾页",
    67         nextText:"下一页",
    68         prevText:"上一页",
    69         firstText:"首页"
    70     });
    71     var timeGrid = new Ext.grid.GridPanel({
    72         id:'timeGrid',
    73         tbar:timeStatusBar,
    74         bbar:pageTBar,
    75         cm:timeColumnModel,
    76         sm:timeSelectModel,
    77         store:timeStore,
    78         autoScroll:true,
    79         stripeRows:true,
    80         height:540
    81     });
    View Code

    Ext grid checkbox在翻页的过程中,会碰到之前勾选的数据,无法记录的情况,这时就应该使用一个临时array变量存储勾选的值,然后在grid每次load的时候,把每行数据与该array变量进行遍历判断,这样就能实现翻页保持勾选数据的效果。

  • 相关阅读:
    nodejs pm2使用
    react生命周期
    It's a start!
    关于react-native报错: Invariant Violation: WebView has been removed from React Native. It can ....
    react-native 页面使用WebView布满整个页面,导航栏不显示问题
    两个函数执行顺序,异步问题处理(已解决)
    react-native webView乱码问题
    react-native 多页面之间传值
    时间戳转换为时间日期格式
    React Native返回刷新页面(this.props.navigation.goBack())
  • 原文地址:https://www.cnblogs.com/dancser/p/3527367.html
Copyright © 2020-2023  润新知