Extjs: problem in Ext.reg()

Question

I got the following error with Extjs 4:

Uncaught TypeError: Object #<Object> has no method 'reg'

I add the .js file which contains following code.

var myStore = new Ext.data.JsonStore({
    id:'ms',
    totalProperty:'totalCount',
    root:'rows',
    url:'http://localhost:8080/ezDI/myservlet',
    fields:[
            {name:'un'},
            {name:'pwd'}]
});

Ext.ns('Example');
 // example grid
Example.Grid = Ext.extend(Ext.grid.GridPanel, {
    initComponent:function() {
        var config = {
            store:myStore,
            columns:[{
                //id:'ms',
                header:"UserName",
                width:40, sortable:true,
                dataIndex:'un'
            },{
                header:"PassWord",
                width:20,
                sortable:true,
                dataIndex:'pwd'
            }],
            viewConfig:{forceFit:true},
            loadMask:true
        }; // eo config object

        // apply config
        Ext.apply(this, Ext.apply(this.initialConfig, config));

        // call parent
        Example.Grid.superclass.initComponent.apply(this, arguments);

        // load the store at the latest possible moment
        this.on({
            afterlayout:{scope:this, single:true, fn:function() {
                this.store.load({params:{start:0, limit:30}});
            }}
        });

    } // eo function initComponent

});

Ext.reg('examplegrid', Example.Grid);

Answer 1

You are writing ExtJS 3 instead of ExtJS 4

You should read the upgrade guide

Here is a small code comparison to illustrate the differences.

// Ext 3:
Ext.ns('MyApp'); // required in Ext 3
MyApp.CustomerPanel = Ext.extend(Ext.Panel, {
    // etc.
});
Ext.reg('examplegrid', Example.Grid);

var panel = new MyApp.CustomerPanel(cfg);


// Ext 4
Ext.define('MyApp.CustomerPanel', {
    extend: 'Ext.panel.Panel',
    alias: 'widget.examplegrid'
    // etc.
});
var panel = Ext.create('MyApp.CustomerPanel', cfg);
//or: var panel = Ext.widget('examplegrid', cfg);

Answer 2

Replacing Ext.reg() (xtype) in ExtJS4?

You create an alias when you extend the grid.