PDA

View Full Version : How to create reusable gridpanel filter?



Sam_I_Am
7 Feb 2020, 10:01 AM
Hi,

I have a gridpanel in a class like this:



Ext.define('MifAdmin.view.ministry.Ministries',{
extend: 'Ext.tab.Panel',
xtype: 'ministries',


items: [{
xtype: 'gridpanel',
title: 'Ministries',
plugins: 'gridfilters',
bind: {
store: '{ministries}'
},
scrollable: false,
columns: [{
xtype: 'gridcolumn',
dataIndex: 'ministryName',
text: 'Ministry Name',
filter: {
type: 'string',
itemDefaults: {
enableKeyEvents: false,
listeners: {
buffer: 1000,
change: function (field, e) {
var f = this.up('gridcolumn').filter;
f.setValue(f.getValue(field));
}
}
}
}
}
...


I want to reuse the same filter for multiple columns. Something like this:


...
columns: [{
xtype: 'gridcolumn',
dataIndex: 'ministryName',
text: 'Ministry Name',
filter: defaultStringFilter
},{
xtype: 'gridcolumn',
dataIndex: 'primaryContact',
text: 'Primary Contact',
filter: defaultStringFilter
}
...




What is the best way to accomplish this? I have tried several things and they are not working. I would like to see how to do this 1) By defining the filter for use just within this class and 2) Defining a filter that could be used across multiple classes.

Thanks.

praveensaini23
25 Feb 2020, 4:22 AM
Hi,

You can return that filter object from a function and call that function many time you want for different columns.
Check the solution in the fiddle - https://fiddle.sencha.com/#fiddle/33v3&view/editor