Cannot read property 'isTree' of undefined

Question

I trying to update code from extjs2 to extjs4, but I have an error and something wrong with grid. My Google Chrome browser return error Cannot read property 'isTree' of undefined

    Ext.define('App.grid.GridPanel', {
    extend: 'Ext.grid.GridPanel',
    alias: 'widget.gridpanel',
    frame: false,
    loadMask: true,
    stateful: false,
    enableColumnHide: false,
    showGridHeader: true,
    viewConfig: {        
        stripeRows: true
    },

    initComponent: function() {
        if (!this.showGridHeader) {
            this.addClass('grid-no-header');
        }

        App.grid.GridPanel.superclass.initComponent.apply(this, arguments);
    },

    getView : function(){
        if(!this.view){
            this.view = new App.grid.GridView(this.viewConfig);
        }
        return this.view;
    }
});

var grid = new App.grid.GridPanel({
        store: store,
        columns: gridColumns,
        frame: false,
    //    autoExpandColumn: 'name',
        autoHeight: true,
        loadMask: true,
        bbar: pagingBar,
        viewConfig: {
            stripeRows: true,
            scrollOffset: 2
        }
    });

Even when I changed App.grid.GridPanel.superclass.initComponent.apply(this, arguments); to this.callParent(this, arguments); I received the same error. Please, help.

Answer 1

You should not use widget.gridpanel as the alias for your grid as there is already an xtype of gridpanel http://docs.sencha.com/extjs/4.1.3/#!/api/Ext.grid.Panel .

Also whats going on with the getView ? You are not providing the implementation for it.

In your initComponent method use this.callParent() as stated in the guides.

Reduce the config to the minimum to get it in the working order, then add what you think is necessary piece by piece.