extjs翻頁多選保留
阿新 • • 發佈:2021-06-10
--extjs翻頁多選
//1、定義儲存選中記錄(翻頁)的集合
var collection=new Ext.util.MixedCollection();
//2、定義選中記錄的CheckboxSelectionModel
var sm = new Ext.grid.CheckboxSelectionModel({singleSelect : false, listeners : { 'rowselect' : function(sm, colIndex, row) {//選中勾選框 collection.add(row.get("dataIndex1"), row); },'rowdeselect' : function(sm, colIndex, row) {//取消勾選框 collection.remove(collection.get(row.get("dataIndex1"))); } } });
//3、定義store,從後臺獲取資料,同時進行監聽-->載入,若後臺中的資料在儲存選中記錄(翻頁)的集合存在,設定勾選
store = new Ext.data.Store({ listeners: { ' load': function (records) { records = records.reader.jsonData.result;if (records.length == 0) return; var selModel = this.gridPanel1.getSelectionModel(); for (var i = 0; i < records.length; i++) { var record = records[i]; for (var j = 0; j < collection.getCount(); j++) { if (record.dataIndex1 == collection.items[j].data.dataIndex1) { selModel.selectRow(i);//若儲存選中記錄(翻頁)的集合存在,設定勾選 } } } }.createDelegate(this) } });
//4、將定義好的store、sm填充到grid下
this.grid = new Ext.grid.GridPanel({ split :true, enableColumnMove : false, enableColumnHide : false, title : title, store : m_store, bbar : new Ext.PagingToolbar({ xtype : 'paging', pageSize : 20, store:m_store, displayInfo:true, displayMsg:'顯示第 {0} 條到 {1} 條記錄,一共 {2} 條', emptyMsg:'沒有記錄' }), columns : [sm, {header : 'header1',dataIndex : 'dataIndex1', align:'center', sortable : true}, {header : 'header2',dataIndex : 'dataIndex2', align:'center', sortable : true} ], selModel : sm });