initComponent alternative

[AlphaBravo]

Hi there,

Firstly, if a moderator could please move this topic to it's appropriate forum section - it would be highly appreciated. I'm not exactly sure what topic it would fall under.

Secondly, my problem: I am creating an accordion, adding children depending on records in a store. I am using the Sencha Designer. I can't override the initComponent (as the designer doesn't let you, as fair as I am aware). Will there be an option to allow one to overwrite/override the initComponent in later versions of the Designer?

Where exactly should i paste my code?

I have tried the following events: beforerender, beforeshow, afterrender, render, afterlayout; with the following error:

Uncaught TypeError: Cannot read property 'dom' of undefined

var me = Ext.getCmp('siderbarPanel');


me.sidebar = new Array();


me.store = Ext.getStore('ModuleFeature');


Ext.Function.defer(function() {
    me.store.each(function(record) {


        var moduleName = record.raw.ModuleName,
            moduleDescription = record.raw.ModuleDescription,
            featureName = record.raw.FeatureName,
            featureDescription = record.raw.FeatureDescription,
            featureXtype = record.raw.FeatureXtype;


        if(me.hasModule(me,moduleName)) {
            var feature = new Object();
            feature.name = featureName;
            feature.description = featureDescription;
            feature.xtype = featureXtype;


            me.sidebar[me.getModuleIndex(me,moduleName)].feature.push(feature);


        } else {
            var module = new Object();
            module.name = moduleName;
            module.description = moduleDescription;
            module.feature = new Array();


            var feature = new Object();
            feature.name = featureName;
            feature.description = featureDescription;
            feature.xtype = featureXtype;


            module.feature.push(feature);     
            me.sidebar.push(module);           
        }
    });


    for (var i = 0; i < me.sidebar.length; i++) {


        var panel = Ext.create('Ext.panel.Panel', {
            title: me.sidebar[i].name        
        })


        for (j = 0; j < me.sidebar[i].feature.length; j++) {     
            panel.add({
                xtype: 'button',
                text: me.sidebar[i].feature[j].name
            });
        }


        //console.log(panel);
        me.add(panel);
    }


}, 200);

Help with this would be greatly appreciated. Logging the newly created panels to the console would show what seems to be correctly created children. Only once i try to add them to the panel will the error be thrown.

Regards

PS: On a side note, the Designer isn't exactly colour-blind friendly when it comes to highlighting code

[ssamayoa]

initComponent(): Create an override class:

x1.jpg

You can override whatever you want in that class.

Regards.