1. #1
    Sencha User jlyman's Avatar
    Join Date
    Nov 2010
    Posts
    28
    Vote Rating
    0
    Answers
    4
    jlyman is on a distinguished road

      0  

    Question Answered: Filtering a store upon view instantiation

    Answered: Filtering a store upon view instantiation


    I feel like I am starting to get the hang of the MVC methodology in ST2, and enjoy my mini-victories when something actually shows up on the screen. That being said, I've run into a problem that has me stumped, despite extensive searching.

    I have a view that contains two lists (specifically, one list with clocked in users, one with clocked out users). I have a User model and a Users store backing the lists and providing data. Currently, if I assign both lists to use store: 'Users' it works just fine. Here is the code I'm using in the view to instantiate one of the lists:

    PHP Code:
    {                        
        
    xtype'list',
       
    flex1,
       
    cls'clockedInList',
       
    itemTpl'<span class="employee">{lastName}, {firstName}</span>'
       
    groupedtrue,
       
    indexBarfalse,
       
    store'Users'

    However, I want to tell each list to filter the store down to just those who are clocked in or out by checking the boolean value in the model. I know I can assign a store via either store: 'Users' or store: Ext.create('MyApp.store.Users'), but then when I try to chain a filter method on to the create() for example, I get a 'Cannot call method 'getGroups' of null, so I'm guessing the store object isn't created just yet.

    I've even tried defining store: 'Users', and then hooking into the initialization() method to set a new one, but the list disappears when I try this (see code below).

    PHP Code:
    store'Users',
    initialize: function() {                             
       
    console.log('running initializes...');
       var 
    store Ext.getStore("Users"); 
       if (!
    store) { 
          
    console.log('store not found, creating');
          
    store Ext.create("Users"); 
       } else 
    console.log('store found, using existing...');
       
    this.store store
       
    this.callParent(arguments); 

    Could someone shed some light on the proper way to do this, and maybe fill in the holes in my understanding? Thanks so much!

  2. (darn, had a good long post written up and the page ate it on preview, so here's a condensed version):

    Looks like this isn't possible how I was envisioning it at the time. Instead, it sounds like you need to create a base store, and then use that base store to load sub-stores manually (original idea found here: http://www.sencha.com/forum/showthre...ferent-filters).

    So for example, here's the code from my base model (Users.js) which manually loads data into my two sub-stores (UsersIn.js, UsersOut.js). See the constructor object for the actually loading:

    PHP Code:
    Ext.define('app.store.Users', {    
    extend'Ext.data.Store',        
    model'app.model.User',    
    sorters'lastName',    
    autoLoadtrue,        

    getGroupString: function(record) {        
               return 
    record.get('lastName')[0];    
    },        

    constructor: function () {        
               
    this.callParent(arguments);                
               
    // Load the sub stores from this one based on the data loaded.        
               
    this.on('load', function (storerecordssuccessfuloperationopts) {             
               var 
    inStore Ext.getStore('UsersIn');
                var 
    outStore Ext.getStore('UsersOut');

                
    inStore.removeAll();
                
    outStore.removeAll();

                for (var 
    i=0i<records.lengthi++) {
                    if (
    records[i].data.clockedIn != '')
                        
    inStore.add(records[i]);
                    else
                         
    outStore.add(records[i]);
                }
            }, 
    this);
        }
        }); 

  3. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,646
    Vote Rating
    899
    Answers
    3575
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Are you wanting to use the same store instance or each list have it's own store?
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  4. #3
    Sencha User jlyman's Avatar
    Join Date
    Nov 2010
    Posts
    28
    Vote Rating
    0
    Answers
    4
    jlyman is on a distinguished road

      0  

    Default


    Preferably, I'd like both lists to use the same store, just filtered. That way I only have to make one request to fill it instead of two, and management would be a lot easier.

  5. #4
    Sencha User jlyman's Avatar
    Join Date
    Nov 2010
    Posts
    28
    Vote Rating
    0
    Answers
    4
    jlyman is on a distinguished road

      0  

    Default


    Any pointers anyone? I'd appreciate it!

  6. #5
    Sencha User jlyman's Avatar
    Join Date
    Nov 2010
    Posts
    28
    Vote Rating
    0
    Answers
    4
    jlyman is on a distinguished road

      0  

    Default How it can potentially be done

    How it can potentially be done


    (darn, had a good long post written up and the page ate it on preview, so here's a condensed version):

    Looks like this isn't possible how I was envisioning it at the time. Instead, it sounds like you need to create a base store, and then use that base store to load sub-stores manually (original idea found here: http://www.sencha.com/forum/showthre...ferent-filters).

    So for example, here's the code from my base model (Users.js) which manually loads data into my two sub-stores (UsersIn.js, UsersOut.js). See the constructor object for the actually loading:

    PHP Code:
    Ext.define('app.store.Users', {    
    extend'Ext.data.Store',        
    model'app.model.User',    
    sorters'lastName',    
    autoLoadtrue,        

    getGroupString: function(record) {        
               return 
    record.get('lastName')[0];    
    },        

    constructor: function () {        
               
    this.callParent(arguments);                
               
    // Load the sub stores from this one based on the data loaded.        
               
    this.on('load', function (storerecordssuccessfuloperationopts) {             
               var 
    inStore Ext.getStore('UsersIn');
                var 
    outStore Ext.getStore('UsersOut');

                
    inStore.removeAll();
                
    outStore.removeAll();

                for (var 
    i=0i<records.lengthi++) {
                    if (
    records[i].data.clockedIn != '')
                        
    inStore.add(records[i]);
                    else
                         
    outStore.add(records[i]);
                }
            }, 
    this);
        }
        }); 

  7. #6
    Sencha User
    Join Date
    Feb 2012
    Posts
    4
    Vote Rating
    0
    kyomster is on a distinguished road

      0  

    Default


    Any other way to do that ? Can a 2 views have the same store instance and each one different store filter ?

  8. #7
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,646
    Vote Rating
    899
    Answers
    3575
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Quote Originally Posted by kyomster View Post
    Any other way to do that ? Can a 2 views have the same store instance and each one different store filter ?
    No, if you filter a store in one view, the other view will reflect this filter.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  9. #8
    Sencha User jlyman's Avatar
    Join Date
    Nov 2010
    Posts
    28
    Vote Rating
    0
    Answers
    4
    jlyman is on a distinguished road

      0  

    Default


    Not that I've seen. Because views are essentially stateless in ST, a change to a store when one view is visible would technically also reflect in the view that isn't visible. If both of those views don't show at the same time, you could always refilter the store on show, but if both are visible at the same time, then you might be out of luck and would need to use a solution like I mentioned earlier.

    But if anybody else knows of a better way, by all means please pipe in, I'd love to know!

  10. #9
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,646
    Vote Rating
    899
    Answers
    3575
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Quote Originally Posted by jlyman View Post
    Not that I've seen. Because views are essentially stateless in ST, a change to a store when one view is visible would technically also reflect in the view that isn't visible. If both of those views don't show at the same time, you could always refilter the store on show, but if both are visible at the same time, then you might be out of luck and would need to use a solution like I mentioned earlier.

    But if anybody else knows of a better way, by all means please pipe in, I'd love to know!
    That's unneeded DOM reflow. Having a separate store for each view is the more performant way. But it's totally up to you.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

Thread Participants: 2

Tags for this Thread