Ext JS 过滤呈现的列

Ext JS filtering rendered columns

本文关键字：JS 过滤 Ext      更新时间：2023-09-26

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

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

你的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;
    }
}]);

修改菜单更改侦听器

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();
        }
    }
}
});
相关文章：