PDA

View Full Version : How to filter ExtJs GridPanel/ExtJs Store?



sande0005
26 Dec 2013, 8:17 PM
I'm new to ExtJs. I have a `GridPanel` which is binded with a `data store`. I have a `checkboxgroup`, which containts the possible values of the `GridPanel` row. I want to filter the `GridPanel` with the `checkboxgroup` values.

Here is the code -


Store1 = new Ext.data.JsonStore({
url: 'CustomerProfiles/GetDetails',
root: 'rows',
fields:['Name','Id']
});

DetailedResults =
{
xtype: 'grid',
autoHeight: true,
autoWidth: true,
autoScroll: true,
border: false,
trackMouseOver: false,
frame: true,
store: Store1,
columns: [
{ header: 'Name', dataIndex: 'Name', width: 90 },
{ header: 'Id', dataIndex: 'Id', width: 50 }
]
};

Leftpanel = new Ext.Panel({
id: 'Leftpanel',
frame: true,
width: 175,
items: [
{
xtype: 'label'
},
{
xtype: 'checkboxgroup',
columns: 1,
vertical: true,
items: [{
boxLabel: 'ALL',
name: 'chkName',
inputValue: 'all'
}, {
boxLabel: 'N1',
name: 'chkName',
inputValue: 'n1'
}, {
boxLabel: 'N2',
name: 'chkName',
inputValue: 'n2'
}, {
boxLabel: 'N3',
name: 'chkName',
inputValue: 'n3'
}],
listeners: {
change: {
fn: function () {
Store1.clearFilter();
var selectedValue = this.getValue();
for (var i = 0; i < selectedValue.length; i++) {
Store1.filter('Name', selectedValue[i].inputValue);
}
}
}
}
}
]});

Where I went wrong?

fmoseley
30 Dec 2013, 1:45 PM
Moving question to ExtJS forums.

scottmartin
10 Jan 2014, 12:27 PM
I looks like you are resetting your filter each time. Consider using a function. Here are some examples:
http://www.sencha.com/forum/showthread.php?229080