How to use a custom component

[Pat Emi]

Hello all,

Am trying to build a reusable component, but i observered that i cannot reuse it. my fire bug displays j is undefined.

this is my code.

Ext.define('MyGridForm', {
        extend: 'Ext.container.Container',
        alias: 'widget.gridform',
               height:600,
        width:'100%',
               constructor: function(config){
            Ext.apply(this, {
                                items: [
                {
                    xtype:'form',
                    title: 'panel 1',
                    width:50,
                    height:50,
                    items:[
                        {
                            xtype:'textfield',
                            label:'First Name'
                        }
                    ]
                },
                {
                xtype:'grid',
                width:50,
                height:50,
                columns:[
            {
                header:'SERVICE TYPE'
            },
            {
                header:'DESCRIPTION'
            },
            {
                header:'AMOUNT(N)'
            }
        ]
            },
                                ]
            });
            this.callParent(arguments);
        }

    });

And this is where i want to use it...

Ext.create('GridForm',{
height:100,
width:100

})

or 
Ext.create('Ext.container.Container',{
height:500,
width:'100%',
items:[
{}
xtype:'gridform'
]
})

From the view of this code is there something am not doing right?
Please any contribution will be appreciated.
Thanks in advance.

Pat.

[mitchellsimoens]

Ext.create('GridForm',{
    height:100,
    width:100
})

Your class name is MyGridForm so it needs to be Ext.create('MyGridForm', {

-----

Ext.create('Ext.container.Container',{
height:500,
width:'100%',
items:[
{}
xtype:'gridform'
]
})

That's just not valid JavaScript. It needs to be:

Ext.create('Ext.container.Container', {
    height:500,
    width:'100%',
    items:[
        {
            xtype: 'gridform'
        }
    ]
})

And you probably need to give the Container a layout.