PDA

View Full Version : How to trigger Ext.ux.grid.FiltersFeature from combobox



sandy.huang
31 Jan 2012, 8:00 AM
Hi Ext JS Community:

My grid has Ext.ux.grid.FiltersFeature. My aim is trigger the filter from combo box.

When user selects the value, it will trigger the Ext.ux.grid.Filters.

However, the filter wont work at the first time. After that, it works fine.

I guess I miss something in my code ? Please Help !

Many thanks,

The combo box handler function


function(field,v)
{
var grid = field.up('suaccessmodulegrid'),
filters = grid.filters;


/*Not sure if it's right thing to do, but sometimes it returns me filter is undefined ?
*So I check if the filters are created, to avoid the filter is undefined issue.
*/
if (filters.filters.length == 0)
{
filters.createFilters();
}

var sFilter = filters.getFilter('selected');
if (v)
{
sFilter.setValue(v);
sFilter.setActive(v);
}
else
{
sFilter.setActive(false);
}

}

Grid class


Ext.define('Erp.view.su.user.access.ModuleGrid',
{
requires :['Ext.ux.CheckColumn'],
extend :'Ext.grid.Panel',
alias :'widget.suaccessmodulegrid',
enableColumnHide :false,
enableColumnResize:true,
initComponent :function() {
if (!this.store)
{
Ext.Msg.alert('Error','Store is Required.');
return ;
}

this.scroll = false ;
Ext.applyIf(
this.viewConfig,
{
stripeRow:true,
style :{
overflow: 'auto',
overflowX: 'hidden'
}
}
);

this.features = [
{
ftype: 'filters',
encode: false,
local: true,
filters: [
{
dataIndex:'selected',
type :'boolean'
}
]
}
]

this.columns = [
{
xtype :'rownumberer',
width :30
},
{
xtype :'checkcolumn',
name :'selectedCol',
dataIndex :'selected',
groupable :false,
width :40
},
{
name :'nameCol',
text :'Name',
dataIndex :'name',
groupable : false,
flex :1
}
];


this.dockedItems =[
{
xtype: 'toolbar',
dock: 'top',
items: [
'->',
{
xtype :'combobox',
name :'viewFilter',
width :130,
labelWidth :40,
editable :false,
forceSelection:true,
fieldLabel :'View',
labelAlign :'right',
emptyText :'All',
store :Ext.create('Ext.data.Store', {
fields: ['name','value'],
data : [
{name:'All',value:false},
{name:UserRightFactory.status.Accessible,value:true}
]
}),
queryMode :'local',
displayField:'name',
valueField :'value'
}
]
},
{
xtype :'toolbar',
dock :'bottom',
defaults :{
disabled :true
},
items :[
{
text :'Reset',
iconCls:'icon-undo',
name :'resetBtn'
},
'->',
{
text :'Save',
iconCls:'icon-disk',
name :'saveBtn'
}
]
}
];
this.callParent(arguments);
}
}
);

mitchellsimoens
31 Jan 2012, 8:40 AM
The filters aren't created until the menu is shown. To create them you can execute createFilters on the filter feature.

Would like the filter feature to listen for the datachanged event on the store so that if the store is filtered then the filters feature would react to it also.

sandy.huang
31 Jan 2012, 9:04 AM
The filters aren't created until the menu is shown. To create them you can execute createFilters on the filter feature.

Would like the filter feature to listen for the datachanged event on the store so that if the store is filtered then the filters feature would react to it also.


Thank you for the quick reply!!
But I don't want the filter feature to listen for datachanged event, just want to set filter to active and trigger store to filter.

My combobox handler already call createFilters in my handler function if filters aren't created.
After calling createFilters, I set sFilter.active = true. It does not filter the store at the first time.

iomanip
6 Feb 2012, 8:10 AM
Thank you for the quick reply!!
But I don't want the filter feature to listen for datachanged event, just want to set filter to active and trigger store to filter.

My combobox handler already call createFilters in my handler function if filters aren't created.
After calling createFilters, I set sFilter.active = true. It does not filter the store at the first time.

I just had the same problem with two combo boxes, one father and the other its child. add the property to all combo Boxes:



lastQuery: ''


It seems that the first time, the combo box has its own filter by default, it doesn't matter how many filters you apply, but they don't seem to be effective until you display the ddl. So to solve that, you add this property to the initial config and problem solved, works like a charm!!!

Mitchell, I don't know u, but it looks like a Bug, or it's not well documented, I read the documentation upside down but there is no lastQuery property, however this solve our problem.:D