extjs3.4:如何在网格上使用存储过滤器

Question

我正在使用ExtJS3.4。我想根据用户为billingName选择的值过滤billingstore。那么，如何将所选值传递给存储或网格？我如何实现这一点？

这是我的代码：

// Store for the grid panel - has billing grid data     
        this.billingStore = new Ext.data.JsonStore({
                autoLoad: {params:{start: 0, limit: 2}},
                filter: {billingName}
                proxy: new Ext.data.HttpProxy({
                    url: '/ELCM/Client/getBillingList.do',
                }),
                root: 'data',
                fields: ['billingName','billingAmount','usedData','duration'],
                totalProperty:'totalRows'
        });
        var billingStore = this.billingStore;
    //view billing
        this.billingGrid = new Ext.grid.GridPanel({
                    title: 'View Billing',
                    store: that.billingStore,
                    columns:[
                          {header: "Amount",dataIndex: 'billingAmount'},
                           {header: "Data Used", dataIndex: 'usedData'},
                           {header: "Duration", dataIndex: 'duration'}
                         ],
                    sm: new Ext.grid.RowSelectionModel({singleSelect: true}),
                    bbar: new Ext.PagingToolbar({
                           store: that.billingStore,       // grid and PagingToolbar using same store
                           displayInfo: true,
                           pageSize: 2
                        }),
                     listeners: {
                                rowclick : function(grid, rowIndex, e){
                                 console.log("row Index "+rowIndex);
                                 }
                      }
        }); 
        var billingGrid = this.billingGrid;

谢谢

Answer 1

根据您要通过商店中的简单过滤方法进行过滤的内容，将实现您的查找。

billingGrid.getStore().filter([{
            property: '',
            id: '',
            value: 
        }
]);

查看 http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.data.Store-method-filter 以获取更多信息。

Answer 2

查看此代码，ExtJS 中的过滤器如何工作，它所需的属性(即根据您的示例进行过滤的计费名称(，然后是过滤器发生的">值">，这 2 是过滤器函数工作所需的强制性选项其他可选配置属性，即 exactMatch 和大小写敏感，它增加了过滤器函数的准确性。

尝试以下代码

// Store for the grid panel - has billing grid data     
this.billingStore = new Ext.data.JsonStore({
            autoLoad: {params:{start: 0, limit: 2}},
            filter: [{
                    property: 'billingName', 
                    value: ''//Data source which need to be filter or based on value selected by the user for billingName
                    exactMatch: true,
                    caseSensitive: true
                }],
            proxy: new Ext.data.HttpProxy({
                url: '/ELCM/Client/getBillingList.do',
            }),
            root: 'data',
            fields: ['billingName','billingAmount','usedData','duration'],
            totalProperty:'totalRows'
    });
var billingStore = this.billingStore;
//view billing
    this.billingGrid = new Ext.grid.GridPanel({
                title: 'View Billing',
                store: that.billingStore,
                columns:[
                      {header: "Amount",dataIndex: 'billingAmount'},
                       {header: "Data Used", dataIndex: 'usedData'},
                       {header: "Duration", dataIndex: 'duration'}
                     ],
                sm: new Ext.grid.RowSelectionModel({singleSelect: true}),
                bbar: new Ext.PagingToolbar({
                       store: that.billingStore,       // grid and PagingToolbar using same store
                       displayInfo: true,
                       pageSize: 2
                    }),
                 listeners: {
                            rowclick : function(grid, rowIndex, e){
                             console.log("row Index "+rowIndex);
                             }
                  }
    }); 
    var billingGrid = this.billingGrid;