Ext JS 过滤呈现的列答案

【问题标题】：Ext JS filtering rendered columnsExt JS 过滤呈现的列
【发布时间】：2016-02-23 22:17:37
【问题描述】：

我希望能够过滤我数据的每一列。每次过滤时，我都会使用：

addFilter({

             dataIndex: 0, //Or 1,2.. depending on the column i want to filter on
             type: 'string', 
             value: value,
});

这里的问题是我要过滤的列的 dataIndex 是一个对象，所以我实际上是在过滤“对象”的字面字符串值。它是 Object，因为在我的商店中，我为每个 dataIndex 存储一个 Object，并使用 render 函数显示它。

点击标题触发菜单，有一个我为过滤器输入的文本框，如果输入“对象”一词的任何字母，它就可以工作。如何让它过滤对象的值，而不是文字字符串'Object'

https://fiddle.sencha.com/#fiddle/163s

【问题讨论】：

标签： javascript extjs

【解决方案1】：

您的type: 'string' 实际上说过滤器应在字符串上工作。因此对象被字符串化为[object object] 并与您提供的值进行比较。

相反，您需要使用自定义过滤器功能。在过滤器上使用 id 会很有用，因此同一列上的新版本会替换旧版本。

var dataIndex = column.dataIndex,
    value = textfield.getValue();
grid.getStore().addFilter([{
    id:"filter-"+dataIndex,
    filterFn:function(record) {
        // Example: Only return records where the object has a property by that name.
        return Ext.Object.getKeys(record.get(dataIndex)).indexOf(value)>-1;
    }
}]);

【讨论】：

我对此有疑问：fiddle.sencha.com/#fiddle/1650 如果您键入“bar”，它会显示正确的行，但如果您删除后者的 'ar'，它会返回到 'b'，但 bammy 不会再出现？是不是因为旧的过滤器没有被删除？
在第 83 行，添加 console.log(Ext.getCmp('myGrid').lockedGrid.getStore().getFilters().getRange()); 并亲自查看...这就是为什么我总是为过滤器提供 id。商店中没有两个具有相同 id 的过滤器 - 新的过滤器将覆盖旧的过滤器。
@Alexander 在为列应用渲染器并使用 GridFilters 中的过滤器时如何应用此过滤器？(docs.sencha.com/extjs/6.5.0/classic/…)
@user6123723 详细信息超出了评论范围，但想法是从现有类中派生一个新类并覆盖constructor 和createMenu。如果你有一个具体的例子你想达到什么，你的问题在这个网站上是一个很好的新问题。

【解决方案2】：

修改您的菜单更改侦听器

Ext.getCmp('myGrid').normalGrid.headerCt.getMenu().add({
xtype: 'textfield',
id: 'myT',
fieldLabel: 'Filter',
listeners: {
    change: function(field, value) {
        console.log([dataindexx, value]);

        Ext.getCmp('myGrid').normalGrid.getStore().filterBy(function(r) {

            if (!r.data[dataindexx].value.indexOf(value)) {
                return true
            };

        });


        if (value === '' || value === undefined) {
            Ext.getCmp('myGrid').normalGrid.getStore().filters.removeAll();
        }
    }
}
});

【讨论】：

谢谢@LightNight，我希望我能接受这两个答案。