CODEWITHSUNDEEP
sencha-touchextjs
hunteryxx
hunteryxx

Reputation: 70

Sencha Touch - How to apply different filters to one store for different uses?

Just wondering is there a way to handle that in Sencha Touch. One store and after applying different filters, the store can be used for different places.

For example:

I have a store:

Ext.regModel('abc', {
    fields: [{name: 'tid', type: 'int'}, {name: 'name',  type: 'string'}, {name: 'parent', type: 'int'}]
});

var store = new Ext.data.Store({
     model: 'abc',
     proxy: {
        type: 'ajax',
        url : 'read.php',
        reader: {
            type: 'json',
            root: 'items',
            fields: ['tid', 'name', 'parent']
        }
    },
    autoLoad: true,
});

And in a FormPanel, it has two selectfields:

items: [
    {
        xtype: 'selectfield',
        name : 'One',
        label: 'Category',
        // store: store, <-- Load the whole store
        store: function(){
            store.filter('name', 'digital'); <-- Load part of store
        },
        displayField: 'name',
        valueField: 'tid'
    },{
        xtype: 'selectfield',
        name : 'Two',
        label: 'subCategory',
        // store: store, <-- Load the whole store
        store: function(){
            store.filter('parent', 1); <-- Load part of store
        },
        displayField: 'name',
        valueField: 'tid'
    },{
    ...}
]

Upvotes: 3

Views: 8317

Answers (1)

mwrf
mwrf

Reputation: 3846

Afraid not, You need two instances of your store.

Why not extend your store, just to make it pre-configured like this:

Ext.regModel('abc', {
fields: [{name: 'tid', type: 'int'}, {name: 'name',  type: 'string'}, {name: 'parent', type: 'int'}]});

MyStore = Ext.extend(Ext.data.Store, {
constructor: function(config) {

config = Ext.apply({

 model: 'abc',
 proxy: {
    type: 'ajax',
    url : 'read.php',
    reader: {
        type: 'json',
        root: 'items',
        fields: ['tid', 'name', 'parent']
    }
},
autoLoad: true,
}, config);

MyStore.superclass.constructor.call(this, config);

}

})

Then you can use multiple instances of your store and filter them how you want:

items: [
{
    xtype: 'selectfield',
    name : 'One',
    label: 'Category',
    store: new MyStore(), //1st instance of MyStore
    displayField: 'name',
    valueField: 'tid',
listeners : {
   'render' : function(){
        this.store.filter('name', 'digital');
    }
}
},{
    xtype: 'selectfield',
    name : 'Two',
    label: 'subCategory',
    store: new MyStore(), //2nd instance of MyStore
    displayField: 'name',
    valueField: 'tid',
listeners : {
   'render' : function(){
        this.store.filter('parent', 1);;
    }
}
},{
...}

]

Upvotes: 3

Related Questions