Extjs中的网格列过滤问题

时间:2017-05-18 11:35:16

标签: extjs

我已经创建了一个网格面板,我想对一些列应用一些过滤。但是我遇到了有关过滤的问题。是否可以在datecolumn对象(xtype:'datecolumn')创建时设置默认过滤?如何在加载网格面板时应用默认过滤选项? 谢谢你的建议。

1 个答案:

答案 0 :(得分:0)

您可以使用gridfilters plugin进行此操作。

以下是Date filter

文档中提供的示例的修改版本

var shows = Ext.create('Ext.data.Store', {
    fields: ['id','show', {
          name: 'airDate',
          type: 'date',
          dateFormat: 'Y-m-d'
    }],
    data: [
        {id: 0, show: 'Battlestar Galactica', airDate: '1978-09-17'},
        {id: 1, show: 'Doctor Who', airDate: '1963-11-23'},
        {id: 2, show: 'Farscape', airDate: '1999-03-19'},
        {id: 3, show: 'Firefly', airDate: '2002-12-20'},
        {id: 4, show: 'Star Trek', airDate: '1966-09-08'},
        {id: 5, show: 'Star Wars: Christmas Special', airDate: '1978-11-17'}
    ]
});

Ext.create('Ext.grid.Panel', {
    renderTo: Ext.getBody(),
    title: 'Sci-Fi Television',
    height: 250,
    width: 375,
    store: shows,
    plugins: 'gridfilters',
    columns: [{
        dataIndex: 'id',
        text: 'ID',
        width: 50
    },{
        dataIndex: 'show',
        text: 'Show',
        flex: 1
    },{
        xtype: 'datecolumn',
        dataIndex: 'airDate',
        text: 'Original Air Date',
        width: 125,
        filter: {
            type: 'date',
            operator: 'on',
            value: {eq:new Date('1999-03-19')}   // equals or ON
            //value: {lt:new Date('1999-03-19')} // less then or BEFORE
            //value: {gt:new Date('1999-03-19')} // greater then or AFTER
            
        }
    }]
});