Extjs store isn't loaded after changing active tab

Question

I have a grid.panel on the side with table names and I'd like to show the table(or it's structure) when the user clicks on it, in another grid.panel inside a tab view.

what i did:

in the actionlistener

var store = Ext.data.StoreManager.lookup('Tables');
currentTable = store.findRecord('name',record.get('name'));

var structureView = Ext.ComponentQuery.query('structure')[0];
structureView.showTable(currentTable);

in the view

showTable: function(table) {
    this.storeObj.getProxy().url = '/tables/stucture/' + table.data.name;
    this.storeObj.load();

    this.update();
}

In the Tables store I have table descriptors, with some basic data like name, etc. and the list with table names displays the content of this store. So I look up the Tables store and get the tabledescriptor and pass it to the view, which then loads the store('Columns' in this case) with the data it will display. And all this works fine until I switch tabs. After changing the active tab and then changing back data is not refreshed on clicking on another table's name and I get this: Uncaught TypeError: Cannot call method 'removeChild' of null. It seems that it can't load the store anymore after changing the active tab. I found this issue on forums but I couldn't find a solution for it.

Do you have any ideas?

Thanks for your time.

Edit:

Ext.define('App.view.Table.Structure', {
    extend: 'Ext.grid.Panel',
    alias: 'widget.structure',
    store: 'Columns',
    width: 800,
    storeObj: undefined,

    initComponent: function () {

        this.columns = [{
            header: 'Column name',
            dataIndex: 'name',
            flex: 1
        }, {
            header: 'Position',
            dataIndex: 'position',
            flex: 1
        }, {
            header: 'Default value',
            dataIndex: 'defaultValue',
            flex: 1
        }, {
            header: 'Column type',
            dataIndex: 'type',
            flex: 1
        }, ];

        this.storeObj = Ext.StoreManager.lookup('Columns');

        this.callParent(arguments);
    }

Can you provide a link example of your code? It's quite difficult to figure out what your issue is without seeing the code in action (or at least an example of it not working). — phatskat

Peter Peter · Accepted Answer · 2012-12-17T10:17:30

Well I managed to solve it at last, but I don't really understand why this solved the problem. So this is what I did:

Every time I needed to update the Columns store(or the others) I looked it up instead of just looking it up in the initcomponent.
Instead of calling update() method I called reconfigure()

Now it works like charm, but I don't see why update didn't do the trick and why I had to look up the store every time I wanted to call load() on it... So if someone could explain it I would be thankful.

Extjs store isn't loaded after changing active tab

1 Answers