List - “[WARN][Ext.dataview.List#applyStore] The specified Store cannot be found

**savitanebula** · 12 Mar 2012 1:21 AM

REQUIRED INFORMATION: -

Sencha Touch version tested:

Sencha Touch 2.0 Final

Browser versions tested against:

Chrome 11 (Windows 7)

Description:

Problem #: Ext.list – I have 2 lists :

1. The 1^st one is displayed inside a panel along with the segmented Button and a toolbar with two buttons.

2. And 2^nd on to an overlay, which invokes on tap of a button ‘Navigation’. This list consists of the same component as the point #1^.3. There are 2 warnings for each list :- “[WARN][Ext.dataview.List#applyStore] The specified Store cannot be found”“[WARN][Ext.dataview.List#applyStore] The specified Store cannot be found”

HELPFUL INFORMATION Screenshot or Video:See attached

Fig: Problem

listpanel.jpg overlay.jpg

The result that was expected:

Problem: The list should have been rendered onto both the overlay as well as the panel list.

The result that occurs instead:

Problem: The list doesn’t render onto the overlay as well as the panel throwing a warning.

Code: Problem
//My panel to display the 1^st list

Code:

{
         xtype: 'panel',
         layout:'hbox',
         id:'listpanel',
         //hidden: true,
         //style: "background-color: red; color: red;",
         //flex:,
         items:
         [
                  {
                          xtype : 'segmentedbutton',
                          defaults:
                          {
                                  flex:1,
                          },
                          height:44,
                          width:250,
                          docked: 'top',
                          items: 
                          [        
                                   {
                                           text: 'Full Charts',
                                           pressed: true,
                                           ui:'dark',
                                   },
                                   {
                                           text: 'Template',
                                   },
                         
                          ],
                         
 
                  },
                  {
                          xtype: 'todolist', // This is where I am calling my list view
                          width:250,
                  },
                  {
                          xtype: 'toolbar',
                          title: '',
                          ui: 'dark',
                          docked: 'bottom',
                          items: 
                          [
                                   {
                                            xtype: 'button',
                                            text:'Activity Log',
                                            //ui: 'action',
                                           //flex:1,
                                           width:100,
                                  },
                                  {
                                           xtype: 'button',
                                           text:'Signatures',
                                           //ui: 'action',
                                           //flex:1,
                                           width:90,
                         
                                   },
                          ]
                 }
         ],
},
 
//code for the overlay list
 
var menuol = Ext.create('Ext.Panel',
{
         requires:['Todo', 'app.model.TodoModel', 'menuList'],
         hideOnMaskTap: true,
         modal: true,
         id:'mainMenu',
        layout: 'fit',
        left: 0,
         //padding: 10,
         //width: 253,
         height: 400,
        //dock: 'left',
         centered: false,
         items: [
                 {
                          xtype : 'segmentedbutton',
                          defaults:
                          {
                                   flex:1,
                          },
                          height:44,
                          width:240,
                          docked: 'top',
                          items: 
                          [        
                                   {
                                            text: 'Full Charts',
                                            pressed: true,
                                            ui:'dark',
                                            items:[
                                                     {xtype: 'menuList', width: 200}
                                            ],
                                   },
                                   {
                                            text: 'Template',
                                   },
                                           
                          ],
                         
                 },
 
 
                 {
                          xtype: 'list', // This is where I am calling my list.
//xtype: 'todolist', 
/* This gives a warning: Registering a component with a id (`todo-list`) which has already been used. Please ensure the existing component has been destroyed (`Ext.Component#destroy()`.
*/
store: 'storelist', //Passing the store
itemTpl: '{text}' //Template for displaying
//width: 250,
                 },
                 {
                          xtype: 'toolbar',
                          title: '',
                          ui: 'dark',
                          docked: 'bottom',
                          items:
                          [
                                   {xtype: 'button',text:'Activity Log',width:100,},
                                   {xtype: 'button',text:'Signatures',width:90},
                          ]
                 }
         ],
        
});
 
 
//code for the list view:
 
Ext.define('app.view.todo.TodoList', 
{
  extend: 'Ext.List',
  alias: ['widget.todoList'],
  requires:['app.model.TodoModel'],
  id: 'todo-list',
  xtype: 'todolist',
  config: 
  {
         itemTpl: '{text}',
         ui: 'light',
         width:250,
         store:'storelist',
         scrollable: true,
         allowDeselect: false,
         grouped:true,
  },
});
 
//code for the store:
 
 
Ext.define('app.store.Todo', {
  extend  : 'Ext.data.Store',
 
  config: 
  {
         model   : 'app.model.TodoModel',
         sorters: 'id',
         id:'storelist',
         grouped:true,
         disclosure: true,
    grouper: function(record)
         {
        return record.get('parent');
    },
         data: 
         [
        
                 { id: '1', text: 'A', parent: 'alpha',},
                 { id: '1', text: 'Aa', parent: 'alpha',},
                 { id: '1', text: 'Aaa', parent: 'alpha',},
 
                 { id: '2', text: 'B', parent: 'beta'},
                 { id: '2', text: 'Bb', parent: 'beta'},
                 { id: '2', text: 'Bbb', parent: 'beta'},
 
                 { id: '3', text: 'C', parent: 'gamma'},
                 { id: '3', text: 'Cc', parent: 'gamma'},
                 { id: '3', text: 'Ccc', parent: 'gamma'},
 
         ],
  }
});
 
//Code for the model:
 
Ext.define('app.model.TodoModel', {
  extend: 'Ext.data.Model',
  config:
  {
           sorters: 'parent',
           //fields: ['id', 'text', 'parent'],
           fields: 
           [
                 {name: "id", type: "string"},
                 {name: "text", type: "string"},
                 {name: "parent", type: "string"},
           ],
           proxy: 
           {
                 type: 'ajax', //type: 'memory',//rest, ajax
                 url: 'todolist',
                 reader: {
                 type: 'json',
                 rootProperty: 'todo'
                 },
                 autoLoad: true,
           },
  }
   
});

Debugging already done:

none

Possible fix:

not provided

Additional CSS used:

none

Operating System:

Windows 7

**savitanebula** · 12 Mar 2012 2:00 AM

Along with the above problem, I have a question for you:

Can I not use a component twice...?? Like in the case of a list view above...

**jsweeney** · 12 Mar 2012 5:30 PM

Were you able to find a solution to this issue? I am getting a very similar error.

**complexero** · 13 Mar 2012 6:19 AM

I ran into this same warning message. Digging through the source, I found that the StoreManager was throwing that error, since it could not locate the store in its list of registered stores. The way to register a store in the StoreManager is to add the storeId config to the store definition.

When I added the storeId config to the store, and used that to reference the datastore in my nestedlist, the warning went away.

http://docs.sencha.com/touch/2-0/#!/...re-cfg-storeId

**svessels** · 16 Mar 2012 9:05 AM

I'm getting this same warning with a list in an Ext.Panel in an Ext.TabPanel. Trying to set a storeId on the store and reference the store by that storeId in the list does not work, either.

**jsweeney** · 16 Mar 2012 9:06 AM

Originally Posted by svessels

I'm getting this same warning with a list in an Ext.Panel in an Ext.TabPanel. Trying to set a storeId on the store and reference the store by that storeId in the list does not work, either.

I have tried the same recommendations and have not resolved this issue yet either.

**Jamie Avins** · 16 Mar 2012 10:13 AM

I've reviewed you code and found several issues you'll need to address:

1) You've defined your todolist with an id. You do not want to do this as this means your will not be able to create more than one todolist. The proper way to use an id is to set it as a configuration like follows:

Code:

{
    xtype: 'todolist',
    id: 'todoList-1'
}

then later:

Code:

{
    xtype: 'todolist',
    id: 'todolist-2'
}

We see this mistake quite a bit, and it's what's causing you to see the warning "Registering a component with a id (`todo-list`) which has already been used. Please ensure the existing component has been destroyed `Ext.Component#destroy()`"

2) I'm assuming you want to share the same Store between the two todolists. That's fine, but you've never actually created the shared Store for them to use. In addition, you'll want to use id as a property of your store, not a configuration option. This will mean that there can only ever be ONE Todo store, but I am assuming this is by design.

Code:

    Ext.define('app.store.Todo', {
        extend:'Ext.data.Store',
        id:'storelist',
        config:{
.
.
.

Remember that this only DEFINES your Todo store, it doesn't create it. This is why you are getting the warning (The specified Store cannot be found). So you will need to create this store as well:

Code:

    Ext.create('app.store.Todo');
    var listpanel = Ext.create('Ext.Panel', {
    ...
    var mainMenu = Ext.create('Ext.Panel', {
    ....

With these changes, you application works as it should with no more warnings.

**Jamie Avins** · 16 Mar 2012 10:15 AM

As for the other posters, if the items I posted don't relate to your cases or you still have issues. Please feel free to start a new thread with your code as savitanebula did an I'll be happy to look it over.

**kennym** · 21 Mar 2012 5:24 AM

Originally Posted by Jamie Avins

I've reviewed you code and found several issues you'll need to address:
2) I'm assuming you want to share the same Store between the two todolists. That's fine, but you've never actually created the shared Store for them to use. In addition, you'll want to use id as a property of your store, not a configuration option. This will mean that there can only ever be ONE Todo store, but I am assuming this is by design.

Code:

    Ext.define('app.store.Todo', {
        extend:'Ext.data.Store',
        id:'storelist',
        config:{
.
.
.

Remember that this only DEFINES your Todo store, it doesn't create it. This is why you are getting the warning (The specified Store cannot be found). So you will need to create this store as well:

Code:

    Ext.create('app.store.Todo');
    var listpanel = Ext.create('Ext.Panel', {
    ...
    var mainMenu = Ext.create('Ext.Panel', {
    ....

With these changes, you application works as it should with no more warnings.

I was encountering the same warnings, as described from the thread author, and following your instructions fixed those. Thanks.

List - “[WARN][Ext.dataview.List#applyStore] The specified Store cannot be found

Thread Tools

Search Thread

Display

List - “[WARN][Ext.dataview.List#applyStore] The specified Store cannot be found

List - “[WARN][Ext.dataview.List#applyStore] The specified Store cannot be found