Buttons and others in Ext.Panel header

[bednee]

Is there a standard way how to add buttons and other stuff (input fields) into Ext.Panel header? The only way I could find is this:



var bla1 = new Ext.Panel({
collapsible : true,
html : 'Hello 1',
height: 50,
listeners : {
render : function(me) {
me.header.layout = 'hbox';
me.header.items.insert(0,'foo',Ext.create('Ext.Button',{
text: 'Test'
}));
me.header.doLayout();
}
}


});


For some reason, it wasn't possible to define this button using xtype, only Ext.create worked.

However, this way doesn't seem to be the right way to do it, but I didn't find anything better.

[mitchellsimoens]

This worked for me:


new Ext.panel.Panel({
renderTo : Ext.getBody(),
width : 400,
html : 'Hello 1',
height : 50,
title : ' ', //header component isn't created if no title or is told not to
listeners : {
render : function(me) {
var header = me.header;

header.insert(0, {
xtype : 'button',
text : 'Test'
});
}
}
})

[bednee]

OK, I see. Maybe I had something else wrong. But still, why isn't it possible to define header items within configuration?

[mitchellsimoens]

There isn't a header config