CODEWITHSUNDEEP
extjs
webCoder
webCoder

Reputation: 2222

how to filter Store extjs?

I want to filter result from store like below. I have textbox and if I write anything in it then It should filter store accordingly. e.g. Store result is 

Monday
Tuesday
Wednesday
Thursday

Filter should work like if I type Mon then result should be Monday only.

I tried below code but no luck.

  items: {
        xtype: 'textfield',
        name: 'value',
        width : '100%',
        align: 'center',
        margin: '0 2 2 2',
        listeners : {
             change: function(field, newValue, oldValue, eOpts) {
             var gridRecords = Ext.getCmp('Grid').getStore();
             gridRecords.filter({
                               property: 'value',
                               value: newValue,
                               anyMatch: true,
                               caseSensitive: false
                                               });
                                            }
                                        }
                                      }

Thanks.

Upvotes: 0

Views: 1341

Answers (3)

David Ffrench
David Ffrench

Reputation: 16

The below code will filter the store like you asked and is not case sensitive. You can also type any part of the string like 'es' and the store will filter to show both 'Tuesday' and 'Wednesday'. 

items: {
  xtype: 'textfield',
  name: 'value',
  width : '100%',
  align: 'center',
  margin: '0 2 2 2',
  listeners : {
    change: function(field, newValue, oldValue, eOpts) {
      var gridRecords = Ext.getCmp('Grid').getStore();
      gridRecords.filterBy(function(record){
        var value = record.get('value').toLowerCase();
        return (value.indexOf(newValue.toLowerCase()) != -1);
      })
    }
  }
}

Upvotes: 0

cpastore84
cpastore84

Reputation: 599

If you are using ExtJS 4, then you will need to clear the previous filter. As the documentation sates, any filter is applied to the previous filter. So before filtering the store call gridRecords.clearFilter().

Here is a working JSFiddle for you to look at.

Upvotes: 1

mindparse
mindparse

Reputation: 7215

Instead of using an object in the filter, pass the values in like so:

gridRecords.filter('value',newValue,true,false);

Upvotes: 0

Related Questions