如何使用Ext.Js实现网格中多个字段的实时搜索/过滤？

Question

我已经在网格上进行了实时搜索.它是根据我提到的过滤器代码的哪一列进行搜索.但我需要根据多列搜索过滤网格记录.在下面的代码中只搜索名称列,因为只提到过滤器代码中提交的名称.我没有得到如何实现多列值搜索？谁能告诉我如何实现？非常感谢.谢谢 .

网格代码在这里:

{
                xtype: 'gridpanel',
                flex: 2,
                hidden: false,
                store: store,
                loadMask: true,
                id: 'grid',
                columns: [
                    {id:'id',header: 'ID', width: 100, sortable: true, dataIndex: 'id'},
                    {header: 'Name', width: 150, dataIndex: 'name'},
                    {header: 'Position', width: 150, dataIndex: 'position'},
                    {header: 'Ambition', width: 250, dataIndex: 'ambition'}                    
                ],
                stripeRows: true,               
                title:'Straw Hats Crew',  
            },

liveSearch文本更改甚至在这里:

onTextFieldChange: function(field, newValue, oldValue, options){
        var grid = Ext.getCmp('grid');
        if(newValue==''){
            grid.store.clearFilter();
        }
        else {
            grid.store.clearFilter();
            grid.store.load().filter([
                {id: 'name', property: "name", value: newValue, anyMatch: true}
            ]);            
        }
    },

Answer 1

这样的事情应该有效.您可以指定可以检查模型中所有字段的任意过滤器函数.

onTextFieldChange: function(field, newValue, oldValue, options){
    var grid = Ext.getCmp('grid');
    grid.store.clearFilter();

    if (newValue) {
        var matcher = new RegExp(Ext.String.escapeRegex(newValue), "i");
        grid.store.filter({
            filterFn: function(record) {
                return matcher.test(record.get('id')) ||
                    matcher.test(record.get('name')) ||
                    matcher.test(record.get('position')) ||
                    matcher.test(record.get('ambition'));
            }
        });
    }
}