CODEWITHSUNDEEP
extjsextjs5extjs6
So4ne
So4ne

Reputation: 1182

Filter an already filtered store

I was wondering if there was any way to filter an already filtered store. Let's say I've got an grid and two filters(F1 & F2). For now, what I'm doing is 

if(!F1 & !F2)
{
grid.store.load().filterBy(function(record, id){
                /*** My function to sort the entire store ***/
            }, this);
}
else if(F1 & !F2){
grid.store.load().filterBy(function(record, id){
                    /*** My function to sort the entire store ***/
                }, this);
}
else if (!F1 & F2) {
grid.store.load().filterBy(function(record, id){
                    /*** My function to sort the entire store ***/
                }, this);
}
else if (F1 & F2){
grid.store.load().filterBy(function(record, id){
                    /*** My function to sort the entire store ***/
                }, this);
}

I'm adding more and more filters for that grid and the number of 'else if' is increasing in a exponential way... Furthermore, I'm filtering on 150k+ records so reseting && filtering on all records at any change can be pretty expensive.

What I'd like is 

if (F1){
 /** filter on the most recent version of the grid **/
}
if (F2){
/** filter on the most recent version of the grid **/
}

Hope I am clear, thank you.

Upvotes: 0

Views: 693

Answers (1)

Evan Trimboli
Evan Trimboli

Reputation: 30082

Use store.getFilters().add().

Fiddle

Ext.application({
    name: 'Fiddle',

    launch: function() {
        var store = new Ext.data.Store({
            fields: ['x'],
            data: (function() {
                var out = [],
                    i;

                for (i = 0; i < 100; ++i) {
                    out.push({
                        x: i
                    });
                }
                return out;
            })()
        });

        var grid = new Ext.grid.Panel({
            store: store,
            columns: [{
                dataIndex: 'x'
            }],
            renderTo: Ext.getBody()
        });

        setTimeout(function() {
            store.getFilters().add({
                filterFn: function(rec) {
                    return rec.get('x') < 50;
                }
            });
            setTimeout(function() {
                store.getFilters().add({
                    filterFn: function(rec) {
                        return rec.get('x') < 10;
                    }
                });
            }, 1000);
        }, 1000);
    }
});

Upvotes: 1

Related Questions