[FIXED-162] Docked back button in tabpanel's tabbar not appearing correctly

[meyerovb]

I want to embed a back button in a tabpanel's scrollable tabbar as shown below, however the button doesn't display correctly.



Ext.setup({ onReady: function () {
var t = { title: 'Tab Tab Tab Tab Tab Tab' };
new Ext.TabPanel({
fullscreen: true,
tabBar: {
scroll: 'horizontal',
dockedItems: [{ xtype: 'button', ui: 'back', text: 'back', dock: 'left'}]
},
items: [t, t, t, t, t]
});
}});

[evant]

Put it in the items, not the docked items.

[meyerovb]

That isn't working, when I put an item in with xtype:button, it makes a tab and the tab's content is a button. I just want a back button docked to the left of the tabs, only in the tab bar. Can you send back example code please?

[evant]

Ext.setup({
onReady: function(){
var t = {
title: 'Tab Tab Tab Tab Tab Tab'
};
new Ext.TabPanel({
fullscreen: true,
tabBar: {
scroll: 'horizontal',
items: [{
xtype: 'button',
text: 'A'
}]
},
items: [t, t, t, t, t]
});
}
});

[meyerovb]

The point of making it a dockedItem was so that it wouldn't scroll with the rest of the tabs.

[evant]

Ext.setup({
onReady: function(){
var t = {
title: 'Tab Tab Tab Tab Tab Tab'
};
new Ext.TabPanel({
fullscreen: true,
dockedItems: [{
dock: 'left',
xtype: 'button',
text: 'A',
stretch: false
}],
tabBar: {
scroll: 'horizontal'
},
items: [t, t, t, t, t]
});
}
});

[evant]

Though still, you should be able to put a button there, it's just not sizing correctly, so we'll take a look.

[meyerovb]

Your last example pushed the entire tabpanel over, not just the tabbar. Thanks for taking a look at it. Could you tag the thread with a Trac ticket # so I can track it with my other tickets? Thanks!

[Jamie Avins]

Ticket added :)

[evant]

This has since been resolved in 0.94. Going to mark this as closed.