Question

EXTJS 怎么样可以 分组又分页

Answer 1

使用 gridpanel 配置group选项 和page

 var cm = [
     {header:'编号',dataIndex:'id',name:'id'},
    {header:'性别',dataIndex:'sex',name:'sex'},
    {header:'名称',dataIndex:'name',name:'name' },
    {header:'描述',dataIndex:'descn',name:'descn'}
   ];
  var data = [
     ['1','male','name1','descn1'],
     ['2','female','name2','descn2'],
     ['3','male','name3','descn3'],
     ['4','female','name4','descn4'],
     ['5','male','name5','descn5'],
     ['6','female','name6','descn6']
    ];  
  var reader = new Ext.data.ArrayReader({}, [
        {name: 'id'},
        {name: 'sex'},
        {name: 'name'},
        {name: 'descn'}
    ]); 
  
   
   var store = new Ext.data.GroupingStore({
    reader:reader,
    data : data,
    groupField:'sex',
    sortInfo:{field:'id',direction:'ASC'}
   });
var pagebar = new Ext.PagingToolbar({  
        store:store,  
        pageSize:10,  
        displayInfo:true,  
        displayMsg:'本页显示第{0}条到第{1}条的记录，一共条{2}。',  
        emptyMsg:'没有记录'  
    });  
    var grid = new Ext.grid.GridPanel({
     autoHeight:true,
     width:300,
     store:store,
     bb:pagebar,
     renderTo:'grid',
    columns:cm,
    view: new Ext.grid.GroupingView()
    });