Extjs4 从复选框获取值-逻辑问题

我有两个

复选框

，分别称为

A

和

B

。当我点击

复选框

A

时，

网格

中的所有特定

字段

应过滤其中包含值

A

的所有值

如果单击

B

，则

网格中的
字段
应过滤并显示其中包含
B
的所有值

如果同时单击，则应同时显示
A和B

        if (chkbxVal== 'A') {
        console.log('Only A');
        return rec.get('gridField') == 'A'; 
        } else if (chkbxVal == 'B'){
        console.log('Only B');
        return rec.get('gridField') == 'B'; 
        } else {
        console.log('both A and B');
        return rec;
        }

如果我有两个复选框，上面的选项就可以使用。但是如果我有3个（或更多）复选框呢。我是否应该有9个条件才能工作？看看下面的原型，它只有3个复选框，我有6个或7个，那么我应该有36-49个，如果其他条件？我有个逻辑问题，有人能帮我吗

if (A){
// display A
} else if (B) {
// display B
} else if (C) {
//display C
} else if (A and B) {
//display A and B
} else if (A and C) {
// display A and C
} else if (B and C) {
//display B and C
} else {
// display all
}

不，那不是个好主意。下面是一个示例，它只升到“E”，但该示例按比例缩放：

Ext.require('*');

Ext.define('MyModel', {
    extend: 'Ext.data.Model',
    fields: ['name', 'filterField']
})

Ext.onReady(function(){

    var active = [];

    function onBoxChange() {
        active = [];
        form.items.each(function(item){
            if (item.checked) {
                active.push(item.inputValue);
            }        
        });
        updateGrid();
    }

    function updateGrid() {
        store.suspendEvents();
        store.clearFilter();
        store.filterBy(function(rec){
            return Ext.Array.indexOf(active, rec.get('filterField')) > -1;
        });
        store.resumeEvents();
        grid.getView().refresh();
    }

    var items = [];

    Ext.Array.forEach(['A', 'B', 'C', 'D', 'E'], function(name){
        items.push({
            boxLabel: name,
            xtype: 'checkbox',
            inputValue: name,
            checked: true,
            listeners: {
                change: onBoxChange
            }
        });
    });

    var form = new Ext.form.Panel({
        flex: 1,
        items: items
    });

    var store = new Ext.data.Store({
        model: MyModel,
        data: [{
            name: 'A1',
            filterField: 'A'
        }, {
            name: 'A2',
            filterField: 'A'
        }, {
            name: 'A3',
            filterField: 'A'
        }, {
            name: 'B1',
            filterField: 'B'
        }, {
            name: 'B2',
            filterField: 'B'
        }, {
            name: 'C1',
            filterField: 'C'
        }, {
            name: 'C2',
            filterField: 'C'
        }, {
            name: 'C3',
            filterField: 'C'
        }, {
            name: 'D1',
            filterField: 'D'
        }, {
            name: 'E1',
            filterField: 'E'
        }, {
            name: 'E2',
            filterField: 'E'
        }, {
            name: 'E3',
            filterField: 'E'
        }, {
            name: 'E4',
            filterField: 'E'
        }]
    });

    var grid = new Ext.grid.Panel({
        flex: 1,
        store: store,
        columns: [{
            dataIndex: 'name',
            text: 'Name'
        }]
    });

    new Ext.container.Viewport({
        layout: {
            type: 'vbox',
            align: 'stretch'
        },
        items: [form, grid]
    });

});