ExtJS4: How to pass arguments to initComponent - constructor

Question

I am using Sencha Architect 2. I am trying to generate a generic UI element with a text search and a table displaying the results. Generic means I want to use it for several different type of searches, e.g. for users, or roles or still something else.
So what I definitely like in this context about Sencha Architect 2 is that it always generates classes. Here is my generated class:
Ext.define('ktecapp.view.ObjSearchPanel', {
extend: 'Ext.container.Container',
alias: 'widget.objsearchpanel',
height: 250,
id: 'UserSearchPanel',
itemId: 'UserSearchPanel',
width: 438,
layout: {
columns: 3,
type: 'table'
},
initComponent: function() {
var me = this;
Ext.applyIf(me, {
items: [
{
xtype: 'textfield',
itemId: 'txtSearchText',
fieldLabel: 'Search Text',
colspan: 2
},
{
xtype: 'button',
id: 'searchObj',
itemId: 'searchObj',
text: 'Search',
colspan: 1
},
{
xtype: 'gridpanel',
height: 209,
itemId: 'resultGrid',
width: 430,
store: 'UserDisplayStore',
colspan: 3,
columns: [
{
xtype: 'gridcolumn',
width: 60,
dataIndex: 'ID',
text: 'ID'
},
{
xtype: 'gridcolumn',
width: 186,
dataIndex: 'DISPLAYNAME',
text: 'Displayname'
},
{
xtype: 'gridcolumn',
width: 123,
dataIndex: 'JOBTITLE',
text: 'Job Title'
},
{
xtype: 'actioncolumn',
width: 35,
icon: 'icons/zoom.png',
items: [
{
icon: 'icons/zoom.png',
tooltip: 'Tooltip'
}
]
}
],
viewConfig: {
},
selModel: Ext.create('Ext.selection.CheckboxModel', {
})
}
]
});
me.callParent(arguments);
}
});
The problem I am having is that everything needs to be pretty customizable, dataIndexes of the columns, the store, ...
So how can I get a constructor like function for the class ObjSearchPanel where I pass all that information? In the code above all this looks pretty much hardcoded...
Thanks in advance
Kai

Answer 1

use config,
http://docs.sencha.com/ext-js/4-0/#!/api/Ext.Class-cfg-config
Ext.define('SmartPhone', {
config: {
hasTouchScreen: false,
operatingSystem: 'Other',
price: 500
},
constructor: function(cfg) {
this.initConfig(cfg);
}
});
var iPhone = new SmartPhone({
hasTouchScreen: true,
operatingSystem: 'iOS'
});
iPhone.getPrice(); // 500;
iPhone.getOperatingSystem(); // 'iOS'
iPhone.getHasTouchScreen(); // true;
iPhone.hasTouchScreen(); // true

Answer 2

Actually (in ExtJS 4), when you pass a config object to the constructor, this config object is assigned to this.initialConfig variable and still available to other functions of the class. So you can use it in the initComponent.
You still can find code in ExtJS 3.3 like this Ext.apply(this, Ext.apply(this.initialConfig, config)); in the initComponent of classes. However, use it at your own risk because this is not in the document of ExtJS 4, only found it in the source code.