Can't load data from store in gridpanel extjs4 MVC

Question

My MVC is below:

MODEL:

Ext.define('test.model.mdlPerson', {
    extend: 'Ext.data.Model',
    fields: [
        { name: 'name' },
        { name: 'surname' }, 
        { name: 'email' }
    ]
});

STORE:

Ext.define('test.store.Person', {
    extend: 'Ext.data.ArrayStore',
    model: 'test.model.mdlPerson',
    data: [
        { name: 'Edddd', surname: 'dfasd', email: '[email protected]' },
        { name: 'Tommy', surname: 'dfgdfgdfg', email: '[email protected]' }
    ],
    storeId: 'Person'
});

GridPanel VIEW:

Ext.define('test.view.GridPanel', {
    extend: 'Ext.grid.Panel',
    title: 'The GridPanel',
    alias: 'widget.gridpanel',
    itemId: 'gridPanelId',
    store: 'Person',
    initComponent: function() {
        columns : [
                { text: 'Name', dataIndex: 'name' },
                { text: 'Surname', dataIndex: 'surname' },
                { text: 'E-mail', dataIndex: 'email' }
            ]
        this.callParent(arguments);
    }
});

CONTROLLER:

Ext.define('test.controller.GridPanel', {
    extend: 'Ext.app.Controller',
    stores: ['Person'],
    models: ['mdlPerson'],
    views: ['GridPanel'],
    refs: [{
        ref: 'gridpanel',
        selector: 'gripanel'
    }]
});

The problem is that the store can't be loaded. I have tried also the getStore() method but nothing appears. Anyone help here! Thank you very much!!!

Jairo R. Flores Jairo R. Flores · Accepted Answer · 2014-08-28T21:03:39

You don't need a controller for that. When data is hardcoded is automatically loaded.

Do you have your app.js? If don't here is

Ext.application({
    models: [
        'mdlPerson'
    ],
    stores: [
        'Person'
    ],
    views: [
        'GridPanel'
    ],
    name: 'test',

    launch: function() {
        Ext.create('test.view.GridPanel', {renderTo: Ext.getBody()});
    }

});

Can't load data from store in gridpanel extjs4 MVC

2 Answers