Local gridfilters

Question

in ExtJS 4 i could create a filter to filter my grid. When is set local to false, i could filter my store.

var filtersCfg = {
    ftype: 'filters',
    autoReload: false, //don't reload automatically
    local: false, //remote filter
    // filters may be configured through the plugin,
    // or in the column definition within the headers configuration
    filters: [{
        type: 'numeric',
        dataIndex: 'id'
    }, {
        type: 'string',
        dataIndex: 'name'
    }, {
        type: 'numeric',
        dataIndex: 'price'
    }, {
        type: 'date',
        dataIndex: 'dateAdded'
    }, {
        type: 'list',
        dataIndex: 'size',
        options: ['extra small', 'small', 'medium', 'large', 'extra large'],
        phpMode: true
    }, {
        type: 'boolean',
        dataIndex: 'visible'
    }]
};

In EXTJS 7 i can only add a plugin:

plugins: {
         gridfilters: true
    },

How can i add a remote filter in EXTJS 7. Is this still possible? I can't find anything in the documentation.

Best regards

Edit:

I'm using a data.Store to get a json from my php/database. Sorting over the grid is not a problem. But how can i use a filter to send the parameters to my php?

var Store = new Ext.data.Store({
            extend: 'Ext.data.Store',
            autoLoad: true,
            remoteSort: true,
            fields: [
                'columnA','columnB'
            ],
            pageSize : 50,
            proxy: {
                type: 'ajax',
                actionMethods: {
                    create : 'POST',
                    read   : 'POST',
                    update : 'POST',
                    destroy: 'POST'
                },
                url: 'data/URL.php',
                reader: {
                    rootProperty: 'columns',
                    totalProperty: 'totalCount'
                },
                simpleSortMode: true,
                extraParams: {
                    task: 'doFiltering'
                }
            },
        sorters: [{
            property: 'columnA',
            direction: 'DESC'
        }]
    });

score 1 · Answer 1 · answered Apr 22 '20 at 12:21

1

I found the solution.

I need to add remoteFilter: true to my store. The whole time i was searching on the wrong place.

This was the solution: How to apply filter function to paging grid with local(memory) store in ExtJS6?

Thank you for your help.

answered Apr 22 '20 at 12:21

Torf

41
4

score 0 · Answer 2 · answered Apr 22 '20 at 11:56

0

In ExtJS 7 you must put filter config in column.

...
    {
        text: 'Email',
        dataIndex: 'email',
        flex: 1,
        filter: {
            type: 'string',
            value: 'lisa'
        }
    },
...

Fiddle

answered Apr 22 '20 at 11:56

pvlt

1,843
1
10
19

Hello, thank you, but this is also only a local filter. I'm using a store with a proxy to get my values from a mysql database. I have more then 10.000 rows. I'm using the **pagingtoolbar** plugin to show only 50 rows (pageSize:50). Remote sort is no problem. But i need a funktion to filter my grid with the database. – Torf Apr 22 '20 at 12:11
Ou, you need remote filtering? – pvlt Apr 22 '20 at 12:17
1

For remote filtering set porperty remoteFilter (https://docs.sencha.com/extjs/6.5.0/classic/Ext.data.AbstractStore.html#cfg-remoteFilter) to `true` – pvlt Apr 22 '20 at 12:21
Yes, i was trying to add remote to my filter. Just like in EXTJS 4. In ExtJS7 i need to add it to the store. – Torf Apr 22 '20 at 12:22

Local gridfilters

2 Answers2