气垫cc跟隔离霜的区别:extjs 分组表格

1、Ext.grid.GroupingView
      主要配置项：
            enableGroupingMenu：是否在表头菜单中进行分组控制，默认为true
            groupByText：表头菜单中分组控制的菜单文字，默认为'Group By This Field'
  
            enableNoGroups：是否允许用户关闭分组功能，默认为true
            showGroupsText：在表头菜单中启用分组和禁用分组的菜单文字，默认为'Show in Groups'
  
            groupTextTpl：用于渲染分组信息的模板，默认为'{text}'，常用的可选值有：
                  text：列标题:组字段值
                  gvalue：组字段的值
                  startRow：组行索引
  
            enableGrouping：是否对数据分组，默认为true
            hideGroupedColumn：是否隐藏分组列，默认为false
            ignoreAdd：在向表格中添加数据时是否刷新表格，默认为false
            showGroupName：是否在分组行上显示分组字段的名字，默认为true
            startCollapsed：初次显示时分组是否处于收缩状态，默认为false
  
      主要方法：
            collapseAllGroups()：收缩所有分组行
            expandAllGroups()：展开所有分组行
            getGroupId( String value )：根据分组字段值取得组id
            toggleAllGroups( [Boolean expanded] )：切换所有分组行的展开或收缩状态
            toggleGroup( String groupId, [Boolean expanded] )：切换指定分组行的展开或收缩状态

 2、Ext.data.GroupingStore
      groupField：分组字段
    groupOnSort：是否在分组字段上排序，默认为false
      remoteGroup：是否远程分组数据，默认为false。如果是远程分组数据，则通过groupBy参数发送分组字段名
 代码如下//-------------------------grid---------------------------*
var inloaderclumn = new Ext.grid.ColumnModel([
 new Ext.grid.RowNumberer(), //获得行号  
{ header: "单据编号", dataIndex: "s_id", sortable: true
    //summaryRenderer: function(v, params, data){
    //return '—';
    //}
},
{ header: "入库时间", dataIndex: "get_in_time", sortable: true,
    renderer: function (val) { return new Date(parseInt(val.substring(6, val.length - 2))).format('yyyy年MM月dd日') }
    //summaryRenderer: function(v, params, data){
    //return '—';
    //}
},
{ header: "货物编码", dataIndex: "code", sortable: true,  hideable: false
    //  summaryRenderer: function(v, params, data){
    //return '—';
    //}
},
{ header: "货物名称", dataIndex: "name", sortable: true //summaryType: 'count', //分组类型，还有:average,sum,max,totalCost
    //summaryRenderer: function(v, params, data){
    //return '—';
    //}
},
{ header: "规格及型号", dataIndex: "spec", sortable: true //summaryType: 'count', //分组类型，还有:average,sum,max,totalCost
    //summaryRenderer: function(v, params, data){
    //return '—';
    //}
},
{ header: "单位", dataIndex: "unit", sortable: true //summaryType: 'count', //分组类型，还有:average,sum,max,totalCost
    //summaryRenderer: function(v, params, data){
    //return '—';
    //}
},
{ header: "单价", dataIndex: "unit_price", sortable: true //summaryType: 'count', //分组类型，还有:average,sum,max,totalCost
    //summaryRenderer: function(v, params, data){
    //return '—';
    //}
},
{ header: "入库量", dataIndex: "act_number", sortable: true
    //summaryType:'sum'
}
]);
_filed01 = ["get_in_sid","s_id", "get_in_time", "code", "name","spec","unit","unit_price","maxValue","minValue","sid","pur_number","act_number","amount","id","state"]
//store
var inload_sore = new Ext.data.GroupingStore({
    url: 'ashx/get_in_lis_store.ashx',
    reader: new Ext.data.JsonReader({
        root: 'data',
        totalProperty: 'totalCount',
        remoteSort: true,
        fields: _filed01
    }),
    sortInfo: { field: 'id', direction: 'ASC' },
    groupField: ['code']
});
var _pageSize02 = 25; //每页显示条数
inload_sore.load({ params: { action: "inloader", start: 0, limit: _pageSize02} });//分页状态
var inlodertbar = new Ext.PagingToolbar({
    store: inload_sore,
    pageSize: _pageSize02,
    //显示右下角信息
    displayInfo: true,
    emptyMsg: "暂无"
});
 
var person = Ext.data.Record.create([  
    {name: "s_id", mapping: 0},  
    {name: "get_in_time", mapping: 1},  
    {name: "code", mapping: 2},  
    {name: "name", mapping: 3},  
  {name: "act_number", mapping: 4}  
]);   //grid
inloadgrid = Ext.extend(Ext.grid.GridPanel, {
        constructor: function () {
        inloadgrid.superclass.constructor.call(this, {
        store: inload_sore,
        cm :inloaderclumn,
        layout: 'fit',
        autoHeight: true,
         //collapsible: true,  
        //animCollapse: false, 
        view: new Ext.grid.GroupingView({  
        sortAscText: "升序",  
        sortDescText: "降序",  
        columnsText: "表格字段",  
        groupByText: "使用当前字段进行分组",
        showGroupsText: "表格分组",
        groupTextTpl: "{text}(共{[values.rs.length]}条)",
         forceFit:true//单元格自动填充
      }),  
      
        bbar:inlodertbar,
        autoScroll:true
       //autoExpandColumn:'action'
        })
    }
});
//-------------------------grid---------------------------*
//--------------------容器panel---------------------
inloaderpanel = Ext.extend(Ext.Panel, {
    _inloadgri: null,
    constructor: function () {
       this._inloadgri = new inloadgrid();
        inloaderpanel.superclass.constructor.call(this, {
           anchor: "100%,100%",
            border: false,
            renderTo: "inloadercontent",
          
           items:this._inloadgri
        })
    }
}); 注意事项：在写代码过程中注意  groupField:'code' 这里写法可以写成groupField:['code' ].;但是这样一写能出来。但是问题就会出现点击收拢分组行的时候就会出现报错。。什么该对象不支持此属性。。