ExtJS - 그리드 결과 그룹화

Question

나는 저장소를 포함하는 그리드가 있습니다. 어떤 이유로 그 그리드의 행을 그룹화 할 수 없습니다.

내 그리드는 다음과 같이 (내가 충분히 명성을 가지고 있지 않기 때문에 사진을 업로드 할 수 없습니다) 같습니다

+-------------+---------------+--------------+---------+ 
| userName | sipUserName | osIdentifier | ...  | 
+-------------+---------------+--------------+---------+ 
|   1 | 1    | 123456  |  1 | 
|   1 | 2    | 654321  |  1 | 
|   3 | 3    | 654321  |  2 | 
|   4 | 4    | 654321  |  1 | 
+-------------+---------------+--------------+---------+ 

을 그리고 난은 '사용자 이름'열을 기준으로 결과를 집계합니다. 내가 사용

UsersGrid = function(config) { 

var serviceName = 'getSystemInfo?groupName='; 
serviceName+=groupName; 


this.store = new RestStore({serviceName: serviceName, fields:[ 
    'userName', 
    'sipUserName', 
    'osIdentifier', 
    'majorVersion', 
    'minorVersion', 
    'patchVersion', 
    'platformIdentifier' 
] , groupField : 'userName' 
}); 


this.store.on('beforeload', function(store, options){ 
    var params = Ext.getCmp('UsersPanel').getParams(); 
    store.baseParams=params; 
}, this); 


UsersGrid.superclass.constructor.call(this, { 
    selModel:new Ext.grid.RowSelectionModel({singleSelect:true}), 
    features: [ 
     { 
     ftype: 'grouping', 
     groupHeaderTpl: [ 
      'ss' 
     ], 
     hideGroupedHeader: true, 
     startCollapsed: false 
     } 
    ], 

    columns:[ 
     {header:'User Name', dataIndex:'userName', width:100, sortable:true} 
     ,{header:'Sip User Name', dataIndex:'sipUserName', width:100, sortable:true} 
     ,{header:'Os Identifier', dataIndex:'osIdentifier', width:100, sortable:true} 
     ,{header:'Major Version', dataIndex:'majorVersion', width:100, sortable:true } 
     ,{header:'Minor Version', dataIndex:'minorVersion', width:100, sortable:true } 
     ,{header:'Patch Version', dataIndex:'patchVersion', width:100, sortable:true } 
     ,{header:'Platform', dataIndex:'platformIdentifier', width:100, sortable:true } 
    ], 

    bbar:new Ext.PagingToolbar({store:this.store, pageSize:50, displayInfo:true}) 
}); 
Ext.apply(this, config); 

this.store.paging = this.getBottomToolbar(); 

}; 
Ext.extend(UsersGrid, Ext.grid.GridPanel, {}); 

가게는 다음과 같습니다 :

그리드는 가게가 들어있는 문제가 무엇인지 파악에

// default REST store 
RestStore = function(cfg) { 
var url = cfg.url || apiUrl; 
var idProperty = cfg.idProperty || 'id'; 
if (!cfg.url && cfg.serviceName) url=url+cfg.serviceName; 
var groupField = cfg.groupField; 

RestStore.superclass.constructor.call(this, { 
    restful:true, 
    proxy: new Ext.data.HttpProxy({ 
     url:url, 
     listeners: { 
      beforewrite:function(writer,action,rs,params){ 
       params.jsonData=params.jsonData.entities; 
      }, 
      beforeload: {scope:this, fn:function(ds, params){ 
       var webQuery={}; 
       var page=1; if (params.start) page = Math.ceil(params.start/params.limit); 

       if (this.paging) { 
        webQuery.numberOrItemsPerRequest = this.paging.pageSize; 
        webQuery.requestNumber = page; 
       } 

       webQuery.likeCriterions = params.likeCriterions; 
       webQuery.simpleCriterions = params.simpleCriterions; 
       webQuery.simpleDateCriterions = params.simpleDateCriterions; 
       webQuery.inCriterions = params.inCriterions; 
       webQuery.orders = params.orders; 


       if (!isEmpty(webQuery)) params.webQuery=webQuery; 
      }} 
     } 
     ,api:{ 
      read:{url:url} 

     } 

    }), 
    reader: new Ext.data.JsonReader(
     {totalProperty:'filter.totalEntities', root:'entities', idProperty:idProperty, messageProperty:'message', successProperty:'success', groupField:groupField}, 
     cfg.fields 
    ) 
    ,writer: new Ext.data.JsonWriter({encode:true, writeAllFields:true}) 
    ,listeners: { 
     exception: function(proxy, type, action, op, res){ 
      var d={}; 
      if (!res.message && res.responseText) { d=Ext.decode(res.responseText); res.message=d.errorMessage; } 
      Ext.Msg.show({title:'Error'+(d.errorCode?' #'+d.errorCode:''), msg:(res.message||'error'), icon:Ext.MessageBox.ERROR, buttons:Ext.Msg.OK, minWidth:600}); 
     }, 
     load:function(ds, rec, op){ // set totalLength 
      if (ds.reader.jsonData.filter && ds.reader.jsonData.filter.totalEntities) ds.totalLength = ds.reader.jsonData.filter.totalEntities; 
     } 
    } 
}); 
}; 
Ext.extend(RestStore, Ext.data.Store); 


Ext.override(Ext.data.JsonReader,{ 

readRecords : function(o){ 
    this.jsonData = o; 
    if(o.metaData) this.onMetaChange(o.metaData); 

    var s = this.meta, Record = this.recordType, f = Record.prototype.fields, fi = f.items, fl = f.length, v; 

    if(s.successProperty){ 
     v = this.getSuccess(o); 
     if(v === false || v === 'false') success = false; 
    } 

    if(s.totalProperty){ 
     v = parseInt(this.getTotal(o), 10); 
     if(!isNaN(v)) totalRecords = v; 
    } 

    if(s.groupField){ 
     groupField = s.groupField; 
    } 

    var root = this.getRoot(o); 
    if (!root) { // no records returned 
     return {success:success, records:[], totalRecords:0, message:o.message}; 
    } 
    var c = root.length, totalRecords = c, success = true; 

    return { 
     success : success, 
     records : this.extractData(root, true), 
     totalRecords : totalRecords, 
     groupField : groupField, 
     remoteGroup : true 
    }; 
} 
}); 

수있는 사람의 도움?

Answer 1

확인. 문제를 해결했습니다!

분명히 ExtJS는 4.0.0 API의 문서를보고있는 동안 버전 3.3.1의 API 문서도 가지고 있습니다.

ExtJS의 세 번째 버전에는 "GroupingStore"라는 것이 있고 그리드에는 GroupingStore에서 groupField를 지원하도록 구성 할 수있는 "view"가 있습니다.

내 구현을 해당 구성 요소로 변경하면 마술이 일어납니다!

하지만 WHY ???? 왜??? 왜 sencha 개발자들은 한 버전과 다른 버전 사이에 그렇게 큰 변화를 만들었습니까? 그 전에 여기에 게시 검사 속성이 'groupField'가게의 proprties의 일부로 표시되지 않도록 불구하고

그래서 많은 고통 :(

Answer 2

UI가 쓰여진 ExtJS의 버전이 3.3.1임을 알게되었습니다.

나는의 ExtJS API 문서를 읽을 때 기록 된 어떤이 :

groupField : 문자열 하는 상점에서 그룹 데이터 필드입니다. 내부적으로 그룹핑은 sorting과 매우 유사합니다. groupField와 groupDir은 첫 번째 정렬 자 (sort 참조)로 주입됩니다. 상점은 단일 레벨의 그룹화를 지원하며 그룹은 getGroups 메소드를 통해 가져올 수 있습니다. 이후 가능한

은 : 4.0.0

이 그룹화의 ExtJS 내 버전에서 사용할 수없는 것을 의미?

버전 3.3.1에서 4로 옮기는 것이 얼마나 어려운가요?