如何在extjs网格的分组摘要中按月或日分组?

时间:2018-12-27 15:05:36

标签: extjs

我有日期,并且我必须根据该日期,该日期的月份,该日期的年和周进行分组。我正在使用Extjs 6.5.3。 我想按以上任何一个分组。我怎样才能做到这一点?请帮忙。

1 个答案:

答案 0 :(得分:0)

您可以使用Ext.grid.feature.Grouping。在网格配置内部,您需要定义

features: [{
    ftype: 'grouping'
}],

在商店内部,您还需要定义groupField: '{your date field name here}'

您可以在这里使用sencha fiddle进行检查。

代码段

Ext.application({
    name: 'Fiddle',

    launch: function () {

        // create the Data Store
        var store = Ext.create('Ext.data.Store', {
            pageSize: 50,

            groupField: 'lastpost',

            fields: [
                'title', 'forumtitle', 'forumid', 'username', {
                    name: 'replycount',
                    type: 'int'
                }, {
                    name: 'lastpost',
                    mapping: 'lastpost',
                    type: 'date',
                    convert:function(v,r){
                        return Ext.util.Format.date(new Date(parseInt(v)*1000), 'd M Y');
                    }
                },
                'lastposter', 'excerpt', 'threadid'
            ],
            autoLoad: true,

            remoteSort: true,
            proxy: {
                // load using script tags for cross domain, if the data in on the same domain as
                // this page, an HttpProxy would be better
                type: 'jsonp',
                url: '//www.sencha.com/forum/topics-browse-remote.php',
                reader: {
                    rootProperty: 'topics',
                    totalProperty: 'totalCount'
                },
                // sends single sort as multi parameter
                simpleSortMode: true
            },
            sorters: [{
                property: 'lastpost',
                direction: 'DESC'
            }]
        });

        Ext.create('Ext.grid.Panel', {
            title: 'ExtJs Forum',
            store: store,
            columns: [{
                text: 'Forum Title',
                dataIndex: 'forumtitle',
                flex: 1
            }, {
                text: 'Title',
                dataIndex: 'title',
                flex: 1
            }],
            features: [{
                ftype: 'grouping'
            }],
            renderTo: Ext.getBody()
        });
    }
});