CODEWITHSUNDEEP
javascriptjsonextjsextjs4
paperstreet7
paperstreet7

Reputation: 2188

ExtJS store, cannot load data to grid

Console is clear. Grid is empty (only column titles are shown). How can I check if data is correctly loaded to the store? It seems to me that the store's autoLoad method is not triggered somehow. Here is the grid:

Ext.define('NameSpace.view.Clients', {
    requires: [
        'Ext.tree.Panel',
        'Ext.grid.Panel'        
    ],
    extend: 'Ext.tab.Panel',
    title: 'Clients',
    alias: 'widget.viewClients',    

    items: [
        {
            xtype: 'panel',
            title: 'All Clients',            

            layout: {
                type: 'hbox',
                align: 'stretch'
            },

            items: [
                {
                    xtype: 'treepanel',
                    title: 'Tree Panel',
                    width: 200,
                    resizable: true                    
                },
                {
                    xtype: 'gridpanel',
                    title: 'Clients List',

                    store: Ext.getStore('storeClients'),

                    flex: '1',
                    columns: [                        
                        { text: 'Name', dataIndex: 'first_name' },
                        { text: 'Last Name', dataIndex: 'last_name' },
                        { text: 'Phone Number', dataIndex: 'phone' }
                    ]
                }
            ]
        }
    ],

    initComponent: function () {
        this.callParent(arguments);
    }
});

And here is the store (Model contains nothing but extend and fields configs):

Ext.define('NameSpace.store.Clients', {
    extend: 'Ext.data.JsonStore',

    proxy: {
        type: 'ajax',
        url: 'http://test.local/client',
        reader: {
            type: 'json',
            root: 'records' 
        }
    },

    autoLoad: true,

    constructor: function (config) {
        this.initConfig(config);
    }
});

Ext.create('NameSpace.store.Clients', {
    model: 'Clients',
    storeId: 'storeClients'    
});

Upvotes: 1

Views: 1865

Answers (4)

Darshan Vachhani
Darshan Vachhani

Reputation: 549

I think you need to write field when you create store. i.e.

fields:[ 'first_name', 'last_name', 'phone']

Upvotes: 0

Amin Bahiraee
Amin Bahiraee

Reputation: 536

You just need to change 

 store: Ext.getStore('storeClients')

To This :

store: 'Clients'

Upvotes: 0

Amit Aviv
Amit Aviv

Reputation: 1816

Why do you override the store constructor? If you actually need to do it, you should add this.callParent(arguments) to the constructor, otherwise the original constructor (which does a lot) won't run.

Upvotes: 1

sha
sha

Reputation: 17860

Move 

model: 'Clients',
storeId: 'storeClients'

into store definition, and get rid of store creation call. Store will be created automatically.

Upvotes: 1

Related Questions