Store not found

Hi there,

i have a Tab-Panel (Home, Info, Basket). On Home-Tab i have a button. When pressed, i want to show a View with a list with data from a Store (setActiveItem). In the Constructor of my Home-Tab i create the Brand-View. In this View i have the list. But i can't get the Store get working.

- i tried to create an Instance of the Store in the List (Constructor) and set the Reference to config/store. Then i got the error message "The specified Store cannot be found". Why isn't the Store initiated? In app.js, i specified the Store.

- store: Ext.create("Tunerwerk.store.Brands") in the List doesn't work as well. Error: Cannot create an instance of unrecognized class name

How can i get the store to be found / working?

app.js

Code:

/*
     This file is generated and updated by Sencha Cmd. You can edit this file as
     needed for your application, but these edits will have to be merged by
     Sencha Cmd when it performs code generation tasks such as generating new
     models, controllers or views and when running "sencha app upgrade".
     Ideally changes to this file would be limited and most work would be done
     in other places (such as Controllers). If Sencha Cmd cannot merge your
     changes and its generated code, it will produce a "merge conflict" that you
     will need to resolve manually.
 */
 Ext.application({
    name: 'Tunerwerk',

requires: [
        'Ext.MessageBox'
],

views: [
        'Main',
'Brands'
],

controllers: [
        'Home'
],

models: [
        'Category',
'Brand'
],

stores: [
        'Categories',
'Brands'
],

icon: {
        '57': 'resources/icons/Icon.png',
'72': 'resources/icons/Icon~ipad.png',
'114': 'resources/icons/Icon@2x.png',
'144': 'resources/icons/Icon~ipad@2x.png'
},

isIconPrecomposed: true ,

startupImage: {
        '320x460': 'resources/startup/320x460.jpg',
'640x920': 'resources/startup/640x920.png',
'768x1004': 'resources/startup/768x1004.png',
'748x1024': 'resources/startup/748x1024.png',
'1536x2008': 'resources/startup/1536x2008.png',
'1496x2048': 'resources/startup/1496x2048.png'
},

launch: function () {
        // Destroy the #appLoadingIndicator element
Ext.fly('appLoadingIndicator').destroy();

// Initialize the main view
Ext.Viewport.add(Ext.create ('Tunerwerk.view.Main'));
},

onUpdated: function () {
        Ext.Msg.confirm(
            "Application Update",
"This application has just successfully been updated to the latest version. Reload now?",
function (buttonId) {
                if  (buttonId === 'yes') {
                    window.location.reload();
}
            }
        );
}
}) ; 

view/Main.js

Code:

Ext . define ( 'Tunerwerk.view.Main' ,  { 
    extend: 'Ext.tab.Panel',
xtype: 'main',
requires: [
        'Ext.TitleBar',
'Tunerwerk.view.HomeTab',
'Tunerwerk.view.InfoTab',
'Tunerwerk.view.BasketTab',
],
config: {
        tabBarPosition: 'bottom',

items: [
            { xtype: 'hometab' },
{ xtype: 'infotab' },
{ xtype: 'baskettab' },

]
    }
}) ; 

view/Home.js

Code:

Ext . define ( ' Tunerwerk .controller.Home' ,  { 
    extend: 'Ext.app.Controller',

requires: [
        'Tunerwerk.utils.Brands'
],


config: {
        refs: {
            selectCarCommand: '#selectCarButton'
},
control: {
            selectCarCommand: {
                tap: 'doSelectCarCommand'
}
        },
brandsView: null
 },

constructor: function (config) {
        this .initConfig(config);
this .setBrandsView(Ext.create ("Tunerwerk.view.Brands"));
},

doSelectCarCommand: function () {
        console.log("Button pressed");
Ext.Viewport.setActiveItem(this .getBrandsView());
Tunerwerk.utils.Brands.load();
}
}) ; 

view/Brands.js

Code:

Ext . define ( 'Tunerwerk.view.Brands' ,  { 
    extend: 'Ext.Container',
xtype: 'BrandsView',

requires: [
        'Ext.TitleBar',
'Tunerwerk.view.BrandsList'
],

config: {
        layout: 'fit',
items: [
            {
                xtype: 'titlebar',
docked: 'top',
title: 'Test'
},
{
                xtype: 'BrandsList'
}
        ]
    }
}) ; 

view/BrandsList.js

Code:

Ext . define ( "Tunerwerk.view.BrandsList" ,  { 
    extend: 'Ext.List',
xtype: 'BrandsList',

required: [
        'Tunerwerk.store.Brands'
],

config: {
        height: '300px',
store: "BrandsStore",  // The specified Store cannot be found

        // store:  Ext.create("Tunerwerk.store.Brands"),
        // ==> Cannot create an instance of unrecognized class name
itemTpl: '<img src="http://ift.tt/1Jnp1sP}" /> {name}'
}


}) ; 

store/Brands.js

Code:

Ext . define ( 'Tunerwerk.store.Brands' ,  { 
    extend: 'Ext.data.Store',

config: {
        itemId: "BrandsStore",
model: 'Tunerwerk.model.Brand',
autoLoad: false
 }

}) ; 

utils/Brands.js

Code:

Ext . define ( 'Tunerwerk.utils.Brands' ,  { 
    singleton: true ,

requires: ['Ext.Ajax', 'Ext.Array', 'Ext.JSON'],

load: function () {
        me = this ;
Ext.Ajax.request({
            url: 'jsontest.php?api=brands',
callback: function (options, success, response) {
                me.convertJsonToObject(response.responseText);
}
        });
},

convertJsonToObject: function (strJson) {
        // Text in JSON konvertieren
arrJson = Ext.JSON.decode(strJson);

// ersten Eintrag mit Anzahl der Treffer löschen
arrJson = Ext.Array.erase(arrJson, 0, 1);

// die Einträge in Objekte umwandeln
var  data = new  Array();
Ext.Array.each(arrJson, function (name, index, arrJsonItSelf) {
            var  item = {};
item.name = name[0];
item.value = name[1];
item.image = name[2];
data.push(item);
});

// den Store aktualisieren
Ext.getStore("BrandsStore").setData(data);

}

}) ; 

Store not found