I want to create buttons that appear on the same horizontal space as the tabs do on a tabpanel. The code below shows how it should look like and be pasted right inside the live demo sections code at https://bryntum.com/products/grid/docs/api/Core/widget/TabBar
The demo of tabbar does show what I want, see the attached screenshot where I have a tabpanel with 3 tabs and a red markup where I want the button to show but it does not show. The screenshow shows a tabpanel with 3 tabs, each tab is a gantt chart. I want a button to the right of the tabs (red markup).
I did eventually figure it out by using the tabpanel's tabbar config, see below that gave me what I wanted
Is there a feature in the Bryntum Library to easily display a right click context menu when the user right clicks the tabs of a tab panel? For example right click the first Table and click delete to remove the tab.
I was able to add a context menu by calling the code below after adding a tab. NOTE: I needed to use menu1 instead of menu, using menu would result in a menu drop down icon getting added for things like button objects.
I was also wondering if there is a framework way to support reordering tabs with drag drop, I did not see anything jump out at me in the API docs
tab.tab.element.addEventListener('contextmenu', event => {
console.log('contextmenu');
event.preventDefault();
if (!tab.tab.menu1) {
tab.tab.menu1 = new Menu({
anchor: true,
owner: tab, // Ensure menu is destroyed when the owning tab is destroyed
items: [
...
],
// Method is called for all ancestor levels
onItem({ item }) {
Toast.show('You clicked ' + item.text);
}
});
}
tab.tab.menu1.showBy(tab.tab);
});
