如何在extjs的网格列标题中添加过滤器？

Question

我有一个有很多记录的网格。所以我想在每个列标题中添加过滤器以便轻松过滤所需的数据。我看到了sencha文档中给出的例子。但是如何在Extjs 4.2版本中实现它。如何在其中使用UX类？有没有插件可用？

我非常感谢你。

请帮帮我。

阿南德

Answer 1

一个解决办法是捕捉到“栏中单击”一栏，让你想过滤并把这个过滤器在网格存储功能帕拉姆。

列实施例

{ 
    header  : "email", 
    dataIndex : 'email', 
    listeners : { 
     click: { 
      element: 'el', //bind to the underlying el property on the panel 
      fn: function(){ 
       storeGrid.filter("email", /\.com$/); // email 
          storeGrid.sort('myField', 'ASC'); 
      } 
     } 
    } 
}, 

煎茶过滤：filter store

煎茶排序：sort store data

Answer 2

这是一个例子：

Ext.define('Webdesktop.view.admin.List', { 
extend: 'Ext.grid.Panel', 
alias: 'widget.admin_casoslist', 
initComponent: function() { 
    var me = this, 
    filters = { 
     ftype: 'filters', 
     encode: false, 
     local: true 
    }; 

    Ext.apply(me, { 
     title: 'gridTitle', 
     store: List_CasSos_Store, 

     filterable: true, 
     features: [filters], 
     closable: true, // fixme: need to set here, because has no effect in tabpanel defaults configuration 
     autoScroll: true, 
     columns: { 
      items:[ 
      { 
       text: 'header1', 
       filter: { 
        type: 'string' 
       }, 
       flex: 1, 
       dataIndex: 'relation_patron_paraine' 
      },{ 
       text:'header2', 
       filter: { 
        type: 'list', 
        options: ['case4', 'case3', 'case2', 'case1'] 
       }, 
       hidden:true, 
       flex: 1, 
       dataIndex: 'etatsante' 
      },{ 
       text:'header3', 
       filter: { 
        type: 'numeric' 
       }, 
       hidden:true, 
       flex: 1, 
       dataIndex: 'revenumnsuel' 
      } 
      ], 
      defaults : { 
       align: 'center' 
      } 
     } 
    }); 
    me.callParent(); 
} 

在控制研究ER：

uses: [ 
    'Webdesktop.view.admin.List', 
    ... 
    'Ext.ux.grid.FiltersFeature' 
    ] 

Answer 3

您需要添加到您的网格配置：

plugins: [{ 
    ptype: 'gridfilters' 
}], 

然后在每一列：

filter: {type: 'string', dataIndex: 'passengerFullName'}, 

注意，过滤器依赖于商店是否会是远程过滤器还是本地过滤器。

这里看到更多的信息：http://docs.sencha.com/extjs/6.0.2-classic/Ext.grid.filters.Filters.html

Answer 4

在头的grid你需要声明过滤器的阵列，然后发挥好电网使用的过滤器。然后写

this.filters = new Ext.ux.grid.GridFilters({ 
      filters:this.filter 
     }) ; 

给该

this.plugins = [this.filters]; 

当你添加一个插件栏写

gridEl.filter{ 
     type: 'list', 
     dataIndex: "DATAINDEX", 
     local : local, 
     dataForFilter : data 
    };