ExtJs中gridpanel分组后组名排序实例代码

168 阅读 0 评论 111 点赞

我是靠谱客的博主甜蜜鞋子，最近开发中收集的这篇文章主要介绍ExtJs中gridpanel分组后组名排序实例代码，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

复制代码代码如下:

/** 
  * 定义降序的groupingStore 
  */
var DescGroupingStore = Ext.extend(Ext.data.GroupingStore, { 
groupDir : 'ASC', 
groupBy : function(field, forceRegroup, direction) { 
    direction = direction ? (String(direction) 
              .toUpperCase() == 'DESC' ? 'DESC' : 'ASC') 
              : this.groupDir; 
    if (this.groupField == field 
           this.groupDir == direction && !forceRegroup) { 
          return; 
   } 
   this.groupField = field; 
   this.groupDir = direction; 
   if (this.remoteGroup) { 
       if (!this.baseParams) { 
          this.baseParams = {}; 
       } 
       this.baseParams['groupBy'] = field; 
          this.baseParams['groupDir'] = direction; 
       } 
       if (this.groupOnSort) { 
            this.sort(field, direction); 
            return; 
       } 
       if (this.remoteGroup) { 
            this.reload(); 
       } else { 
            var si = this.sortInfo || {}; 
            if (si.field != field || si.direction != direction) { 
                this.applySort(); 
            } else { 
                this.sortData(field, direction); 
            } 
            this.fireEvent('datachanged', this); 
        } 
    }, 
    applySort : function() { 
        Ext.data.GroupingStore.superclass.applySort.call(this); 
        if (!this.groupOnSort && !this.remoteGroup) { 
            if (this.groupField != this.sortInfo.field 
                    || this.groupDir != this.sortInfo.direction) { 
                this.sortData(this.groupField, this.groupDir); 
            } 
        } 
    }, 
    applyGrouping : function(alwaysFireChange) { 
        if (this.groupField !== false) { 
            this.groupBy(this.groupField, true, this.groupDir); 
            return true; 
        } else { 
            if (alwaysFireChange === true) { 
                this.fireEvent('datachanged', this); 
            } 
            return false; 
        } 
    } 
});

复制代码代码如下:

/*************************调用***************************/
// 消息列表数据源 
var messageStore = new DescGroupingStore({ 
    proxy : new Ext.data.HttpProxy({ 
        url : "listMessGrid.action"
    }), 
    reader : myReader, 
    groupDir : 'DESC', 
    groupField : 'status', 
    sortInfo : { 
        field : 'id', 
        direction : "DESC"
    } 
}); 
messageStore.load();

复制代码代码如下:

/*****************在gridpanel中添加如下属性*************************************/
view : new Ext.grid.GroupingView({
    showGroupName : false,
    groupTextTpl : '{gvalue}:{text} ({[values.rs.length]} {[values.rs.length > 1 ? "封" : "封"]})',
    showGroupsText : "ddd"
})