Results 1 to 6 of 6

Thread: Globally registering a store vs using the StoreManager to look a store up

  1. #1
    Sencha Premium Member CSchmitz81's Avatar
    Join Date
    Nov 2012
    Location
    Saint Louis
    Posts
    118
    Answers
    6

    Default Answered: Globally registering a store vs using the StoreManager to look a store up

    I just had a problem that I posted to the forms about (and got a quick answer, thank you).

    I was having a problem getting my store to load in the application. A forum user pointed out that I had not registered my store as a global store in the Application.js file and that was preventing sencha from loading it.

    I registered it and it's all working fine now, but I'm still a bit unclear on the issue.

    When reading through the grid.panel API documentation it looks like as long as you assign the `storeId` config to your store you can use the StoreManager to look it up like so:

    Code:
    Ext.data.StoreManager.lookup('myStoreId')
    When I tried this in my code it didn't work:

    Code:
    Ext.define('CoolPets.view.main.Main', {
        extend: "Ext.panel.Panel",
        
        title: 'List of cool pets',
        items:[
            {
                xtype:'grid',
                store: 'Pets', // referring to the globally registered store like this does work
                // store: Ext.data.StoreManager.lookup('petstore'), // Looking the store up like this did not work
                columns: [
                    {text: 'Name', dataIndex: 'name', sortable: true},
                    {text: 'Type', dataIndex: 'type', sortable: true},
                    {text: 'Age', dataIndex: 'age', sortable: true}
                ]
            }
        ]
    });
    When should I use the lookup vs globally registering the store? Is there an advantage one way or the other?

    If there's a link to a documentation page that explains this I would definitely appreciate it. I just haven't been able to find the explanation so far.

    Thanks!

  2. You can use either method. They probably equate to the same thing. The thing that's giving you trouble in your view is that your call to "Ext.data.StoreManager.lookup('petstore')" is happening when the view file is loaded into the page... not when the view is created. Because of that, it's unlikely that "petstore" is already registered with the StoreManager.

    If you want to get around that problem, you'll want to build your views in such a way that method calls get evaluated when the view is created.

    Here's an example of your view that should work:
    Code:
    Ext.define('CoolPets.view.main.Main', {
        extend: "Ext.panel.Panel",
        title: 'List of cool pets',
        initComponent: function () {
            var me = this;
    
            me.items = me.buildItems();
            me.callParent();
        },
        buildItems: function () {
            return [
                {
                    xtype:'grid',
                    store: Ext.data.StoreManager.lookup('petstore'), // Now this function will get called when the view is created.
                    columns: [
                        {text: 'Name', dataIndex: 'name', sortable: true},
                        {text: 'Type', dataIndex: 'type', sortable: true},
                        {text: 'Age', dataIndex: 'age', sortable: true}
                    ]
                }
            ];
        }
    });
    Because your call to lookup the store is now designed to run when the view is created, it should work much more how you were expecting it to.

    Please let me know if you need any clarification.

  3. #2
    Sencha Premium User krullj's Avatar
    Join Date
    Sep 2011
    Posts
    123
    Answers
    5

    Default

    You can use either method. They probably equate to the same thing. The thing that's giving you trouble in your view is that your call to "Ext.data.StoreManager.lookup('petstore')" is happening when the view file is loaded into the page... not when the view is created. Because of that, it's unlikely that "petstore" is already registered with the StoreManager.

    If you want to get around that problem, you'll want to build your views in such a way that method calls get evaluated when the view is created.

    Here's an example of your view that should work:
    Code:
    Ext.define('CoolPets.view.main.Main', {
        extend: "Ext.panel.Panel",
        title: 'List of cool pets',
        initComponent: function () {
            var me = this;
    
            me.items = me.buildItems();
            me.callParent();
        },
        buildItems: function () {
            return [
                {
                    xtype:'grid',
                    store: Ext.data.StoreManager.lookup('petstore'), // Now this function will get called when the view is created.
                    columns: [
                        {text: 'Name', dataIndex: 'name', sortable: true},
                        {text: 'Type', dataIndex: 'type', sortable: true},
                        {text: 'Age', dataIndex: 'age', sortable: true}
                    ]
                }
            ];
        }
    });
    Because your call to lookup the store is now designed to run when the view is created, it should work much more how you were expecting it to.

    Please let me know if you need any clarification.

  4. #3
    Sencha Premium Member CSchmitz81's Avatar
    Join Date
    Nov 2012
    Location
    Saint Louis
    Posts
    118
    Answers
    6

    Default

    Ah gotcha! That makes sense.

    Even with the initComponent method to load the grid when the main panel is initialized the store is not recognized, but I get the idea and I can dig in further from there.

    Thanks for the clarification!

    EDIT:
    Crap, I accidentally marked my reply to you as the best answer and now I can't change it over. :/

  5. #4
    Sencha Premium User krullj's Avatar
    Join Date
    Sep 2011
    Posts
    123
    Answers
    5

    Default

    Haha, don't worry about it. Maybe a mod will come along and fix it.

  6. #5
    Sencha User joel.watson's Avatar
    Join Date
    Nov 2014
    Posts
    3,120
    Answers
    446

    Default

    Quote Originally Posted by krullj View Post
    Haha, don't worry about it. Maybe a mod will come along and fix it.
    Fixed!

    Thanks for sharing your solution
    Joel

  7. #6

    Default Hi

    After adding below codes I am getting error:

    Uncaught TypeError: Cannot read property 'length' of undefined
    at j.hasLockedColumns (ext-all.js:21)
    at j.initComponent (ext-all.js:21)
    at j.callParent (ext-all.js:21)
    at j.initComponent (UserDetailsGrid.js?_dc=1486028088188:45)
    at j.constructor (ext-all.js:21)
    at j.callParent (ext-all.js:21)
    at new constructor (ext-all.js:21)
    at j [as self] (ext-all.js:21)
    at Object.widget (ext-all.js:21)
    at A.create (ext-all.js:21)



    Quote Originally Posted by krullj View Post
    You can use either method. They probably equate to the same thing. The thing that's giving you trouble in your view is that your call to "Ext.data.StoreManager.lookup('petstore')" is happening when the view file is loaded into the page... not when the view is created. Because of that, it's unlikely that "petstore" is already registered with the StoreManager.

    If you want to get around that problem, you'll want to build your views in such a way that method calls get evaluated when the view is created.

    Here's an example of your view that should work:
    Code:
    Ext.define('CoolPets.view.main.Main', {
        extend: "Ext.panel.Panel",
        title: 'List of cool pets',
        initComponent: function () {
            var me = this;
    
            me.items = me.buildItems();
            me.callParent();
        },
        buildItems: function () {
            return [
                {
                    xtype:'grid',
                    store: Ext.data.StoreManager.lookup('petstore'), // Now this function will get called when the view is created.
                    columns: [
                        {text: 'Name', dataIndex: 'name', sortable: true},
                        {text: 'Type', dataIndex: 'type', sortable: true},
                        {text: 'Age', dataIndex: 'age', sortable: true}
                    ]
                }
            ];
        }
    });
    Because your call to lookup the store is now designed to run when the view is created, it should work much more how you were expecting it to.

    Please let me know if you need any clarification.

Similar Threads

  1. store is not registered in StoreManager
    By giladfit in forum Ext 5: Q&A
    Replies: 2
    Last Post: 27 Aug 2014, 9:03 PM
  2. StoreManager.get(key) cannot get store's proxy
    By WutongDeath in forum Ext: Q&A
    Replies: 3
    Last Post: 28 May 2013, 4:39 PM
  3. Dynamically-created Local Storage store not in StoreManager
    By george.m in forum Sencha Touch 2.x: Q&A
    Replies: 7
    Last Post: 7 Nov 2012, 7:10 AM
  4. Replies: 6
    Last Post: 5 Jul 2012, 1:52 AM
  5. [NOREPRO] [PR4] Ext.data.StoreManager get store by ID
    By maxLodoss in forum Sencha Touch 2.x: Bugs
    Replies: 4
    Last Post: 2 Feb 2012, 9:27 PM

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •