PDA

View Full Version : Extjs 3.4 reuse same grid in two tabPanel



cristiano.gregnanin
13 Oct 2014, 11:46 PM
I have a grid and 2 tabPanel. When i change the tab I reconfigure the colum model and I want to show the reconfigured grid. Is possibile?



var tabPanel = new Ext.TabPanel(
{
renderTo: 'panel',
activeTab: 0,
items: [
{
itemId: bt,
title:'one',
items: grid
},
{
itemId: mlt
title:'two',
}],
listeners:
{
tabchange: function(panel, tab){

tab.itemId == mlt ? grid.reconfigure(grid.getStore(), mltColModel) : grid.reconfigure(grid.getStore(), btColModel);

}
}
});


As you can see there are 2 tab and 1 grid. In the second tab named 'two' I don't use the items property becouse in html a component can be rendered only one time. With this configuration the grid is not shown when I go in the second tab named "two"

slemmon
18 Oct 2014, 12:58 AM
Why not just have a grid for tab 1 and a grid for tab 2? Why try and use the same component in two places?

cristiano.gregnanin
19 Oct 2014, 5:28 AM
Why not just have a grid for tab 1 and a grid for tab 2? Why try and use the same component in two places?
I have same grid becouse changing column model on the fly is best solution for me. Difference between 2 column models is only few columns. In addition I have a business logic that must be shared between 2 grids. The business logic I am using for the first grid is the same that I am using for the second grid. So having only one grid is best solution for me.

slemmon
19 Oct 2014, 9:17 PM
Looks like you'll need to have the grid be the child of each tab and do tabPanel.tabA.remove(grid, false) from the tab as it's deactivated and tabPanel.tabB.add(grid) when activated.

cristiano.gregnanin
29 Oct 2014, 5:14 AM
Your solution works for me . Thanks