Question

定义了Store：

var myStore = Ext.create('Ext.data.JsonStore', {
    autoLoad: true,
    autoDestroy: true,
    model: 'Project',
    proxy: {
        type: 'ajax',
        url: '/project/list',
        reader: {
            type: 'json',
            root: 'data'
        }
    },
    remoteSort: false,
    remoteFilter: false
});

由grid panel：

使用

Ext.create('Ext.grid.Panel', {
    store: store,
    columns: [{
            dataIndex: 'option',
            text: 'Option',
            filter: {
                type: 'list',
                store: optionStore // how this should be defined?
            }
    }], // many columns with 'list' filters 
    features: [{
        ftype: 'filters',
        local: true
    }]
});

从服务器加载数据后，所有操作（排序，过滤）都在本地执行。列中显示的所有值都来自一组固定的值，因此过滤器＆＃39;类型为list。是否可以根据商店中的值自动生成过滤器（myStore）？

建议的解决方案：

columns: [{
    dataIndex: 'name',
    text: 'Name',
    filter: {
        type: 'string'
    }
}, {
    dataIndex: 'client',
    text: 'Client',
    filter: {
        type: 'list' // caused the filtering to be disabled
    }        
}, {
    dataIndex: 'domain',
    text: 'Domain'
}]

Answer 1

您的问题有点模糊，特别是因为您将myStore称为网格商店，但在您的网格代码中，您使用store并且然后又有optionStore，似乎没有在任何地方定义（似乎你已经从ExtJS例子中得到了它）。

无论如何，如果我正确理解您的问题，您希望根据网格中的数据自动填充ListFilter吗？

请参阅options或store配置属性的文档：

如果既未指定商店也未指定选项，则选项列表为从指定的所有唯一值自动填充过滤器调用时第一次存储中的dataIndex字段。

应该足以省略这些属性以获得所需的结果：

columns: [{
    dataIndex: 'option',
    text: 'Option',
    filter: {
        type: 'list'
        // omit 'options' and 'store' configuration
    }
}]

编辑：提供fiddle

Answer 2

所以myStore是网格的存储吗？如果是这样，请将此方法添加到其中：

,getUniqueValues:function(field) {
    var  me = this
        ,results = {}
    ;

    me.each(function(record){
        var value = record.get(field);
        results[value] = {};
        results[value][field] = value;
    });

    return Ext.Object.getValues(results);
} // eo function getUniqueValues

现在，监听myStore加载事件（如果它是远程的）并在侦听器中调用getUniqueValues，传递您想要唯一值的字段名称。拥有唯一值数组，您可以执行任何操作，例如：加载到组合，用作网格过滤器的列表等

当然，您可以通过更改方法本身来修改返回数据的格式。

ExtJS网格过滤器自动从商店中的数据创建可能的选项列表

2 个答案: