Ext.Toolbar items not showing up

[h4m1d.r3z4]

Hi everyone,

I'm creating a pretty simple app but unfortunately I cannot get it to work properly. The app is consisted of an Ext.Panel in which lays an Ext.Toolbat. Here's the code:


mainPanel = new Ext.Panel({
fullscreen: true,
layout: 'card',

dockedItems: [
new Ext.Toolbar({
dock: 'top',
title: 'test app',
items: [
new Ext.Button({
xtype: 'button',
ui : 'back',
text: 'Back',
handler: function() {}
}),
{xtype: 'spacer'},
new Ext.Button({
xtype: 'button',
ui : 'decline',
text: 'Sign out',
handler: function() {}
})
]
})
]
});

And here's the output
http://i55.tinypic.com/160bu5t.png

I have no idea why I don't see the buttons. What am I doing wrong? Any help is much appreciated, thanks.

EDIT: When I do a console.log it shows that toolbar has 0 items!

[AndreaCammarata]

Hi and welcome.
To solve your issue just edit the code in the following way



mainPanel = new Ext.Panel({
fullscreen: true,
layout: 'card',
dockedItems: [{
xtype: 'toolbar',
dock: 'top',
title: 'test app',
items: [{
xtype: 'button',
ui : 'back',
text: 'Back',
handler: function() {}
},{
xtype: 'spacer'
},{
xtype: 'button',
ui : 'decline',
text: 'Sign out',
handler: function() {

}
}]
}]
});


You don't need to define a button with

new Ext.Button({..})

you just need to set the corrisponding xtype.
Even notice that if you create a button in that way, you don't need to set xtype property, just like the code below.



var btn1 = new Ext.Button({
ui : 'back',
text: 'Back',
handler: function() {}
});

var btn2 = new Ext.Button({
ui : 'decline',
text: 'Sign out',
handler: function() {}
});

mainPanel = new Ext.Panel({
fullscreen: true,
layout: 'card',
dockedItems: [{
xtype: 'toolbar',
dock: 'top',
title: 'test app',
items: [
btn1,
{
xtype: 'spacer'
},
btn2
]
}]
});


Hope this helps.

[h4m1d.r3z4]

Thanks a lot for the reply. The buttons still don't show up!

Edit: It was a silly mistake, I was calling removeAll method of the toolbar somewhere in the code and I wasn't really aware of it. Thanks for the tips though.

[AndreaCammarata]

You are welcome.