-
6 Oct 2011 11:08 PM #1
Answered: Defining toolbar outside the tabpanel and retrieving it inside tabpanel's items Ext4
Answered: Defining toolbar outside the tabpanel and retrieving it inside tabpanel's items Ext4
Hi . . .
I am trying to define the toolbar outside the tabpanel in which it is supposed to be docked at the top.
I don't know how to retrieve it inside the tabpanel's items.
Following is the way i tried inside the tab, but the toolbar doesn't appear on the tab.
items : [new Ext.toolbar.Toolbar(tb)]
please suggest the correct way.
CODE SNIPPET:
tb=Ext.create('Ext.toolbar.Toolbar', {
contentEl: 'tb',
dock: 'top',
items: [
{
xtype: 'combobox',
width: 183,
fieldLabel: 'Search Results By'
},
{
xtype: 'textfield',
width: 69
// fieldLabel: ''
},
{
xtype: 'button',
text: 'Search',
cls : "x-btn-text-icon",
handler : function() {
CDD.ManageFunction.filterGrid(grid,filterBySelect.getEl().value, searchString.getEl().value);
}
},
{
xtype: 'button',
text: 'Clear',
icon : 'images/icons/reset.gif',
handler : function() {
cancelGrid();
}
},
{
xtype: 'tbtext',
text: 'Note: Right click on Column to sort'
}
]
});
-
Best Answer Posted by arcan9ne
If I understand correctly, you want your toolbar displayed in the tab, correct? If so, try the following instead of items:
This toolbar will be displayed at the top of every one of your tabs.Code:xtype: 'tabpanel', tbar: tb
Now if you want to retrieve the toolbar from the tabpanel to be used in one of your tabs (for whatever reason, adding items to it, etc..), give your toolbar an itemId such as:
Code:Ext.create('Ext.toolbar.Toolbar',{ itemId: 'my_toolbar', etc...... }) whatever_panel_I_want_to_get_the_toolbar_for.getDockedComponent('my_toolbar').
-
7 Oct 2011 4:32 AM #2
If I understand correctly, you want your toolbar displayed in the tab, correct? If so, try the following instead of items:
This toolbar will be displayed at the top of every one of your tabs.Code:xtype: 'tabpanel', tbar: tb
Now if you want to retrieve the toolbar from the tabpanel to be used in one of your tabs (for whatever reason, adding items to it, etc..), give your toolbar an itemId such as:
Code:Ext.create('Ext.toolbar.Toolbar',{ itemId: 'my_toolbar', etc...... }) whatever_panel_I_want_to_get_the_toolbar_for.getDockedComponent('my_toolbar').
-
3 Nov 2011 1:55 AM #3
Thank you . . .



Reply With Quote