Pandaman
10 Aug 2009, 4:45 PM
I am having a problem with TreeGrids rendering on tabs when the user selects different tabs. In my example, starting with the "Real Time" tab visible, whenever you select the "Single Strat" tab, then the "Real Time" back again, the rows only render properly on mouse over.
If I add the TabPanel to a GWT VerticalPanel instead of a LayoutContainer, I get even weirder results; switching tabs and back and forth results in one of the TreeGrids does not render the fields at all, and the columns don't render properly either.
This all only happens in IE6, by the way.
What am I doing wrong? Is it because I am using setAutoHeight? Shouldn't I be able to use it?
public void onModuleLoad() {
final TabPanel tabPanel = new TabPanel();
tabPanel.setDeferredRender(false);
final TabItem rtTab = new TabItem();
rtTab.setLayout(new RowLayout());
rtTab.setHideMode(HideMode.OFFSETS);
final ContentPanel rtDataTreeGridCP = new ContentPanel();
final TreeGrid<BaseModel> rtDataTreeGrid = buildTestTreeGrid();
rtDataTreeGrid.setEnableColumnResize(false);
rtDataTreeGrid.setAutoHeight(true);
rtDataTreeGridCP.add(rtDataTreeGrid);
rtDataTreeGridCP.setHeaderVisible(false);
rtTab.add(rtDataTreeGridCP);
final ContentPanel rtTotalsTreeGridCP = new ContentPanel();
final TreeGrid<BaseModel> rtTotalsTreeGrid = buildTestTreeGrid();
rtTotalsTreeGrid.setEnableColumnResize(false);
rtTotalsTreeGrid.setHideHeaders(true);
rtTotalsTreeGrid.setAutoHeight(true);
rtTotalsTreeGridCP.add(rtTotalsTreeGrid);
rtTotalsTreeGridCP.setHeaderVisible(false);
rtTab.add(rtTotalsTreeGridCP);
//needed to load grid data into tab content before the corresponding tab is selected.
rtTab.setText("Real Time");
rtTab.setAutoHeight(true);
final TabItem ssTab = new TabItem();
ssTab.setLayout(new RowLayout());
ssTab.setHideMode(HideMode.OFFSETS);
final ContentPanel ssDataTreeGridCP = new ContentPanel();
final TreeGrid<BaseModel> ssDataTreeGrid = buildTestTreeGrid();
ssDataTreeGrid.setEnableColumnResize(false);
ssDataTreeGrid.setAutoHeight(true);
ssDataTreeGridCP.add(ssDataTreeGrid);
ssDataTreeGridCP.setHeaderVisible(false);
ssTab.add(ssDataTreeGridCP);
//needed to load grid data into tab content before the corresponding tab is selected.
ssTab.setText("Single Strat");
ssTab.setAutoHeight(true);
tabPanel.add(rtTab);
tabPanel.add(ssTab);
layoutContainer.add(tabPanel);
populateWithDummyData(rtDataTreeGrid);
populateWithDummyData(rtTotalsTreeGrid);
populateWithDummyData(ssDataTreeGrid);
RootPanel.get().add(layoutContainer)
}
private static TreeGrid<BaseModel> buildTestTreeGrid() {
final List<ColumnConfig> columns = new ArrayList<ColumnConfig>();
final ColumnConfig column = new ColumnConfig("name", "name", 500);
columns.add(column);
column.setRenderer(new WidgetTreeGridCellRenderer<BaseModel>() {
@Override
public Widget getWidget(BaseModel model, String property,
ColumnData config, int rowIndex, int colIndex,
ListStore<BaseModel> store, Grid<BaseModel> grid) {
// TODO Auto-generated method stub
final String text = model.get(property);
return new Text(text);
}
});
final TreeGrid<BaseModel> treeGrid = new TreeGrid<BaseModel>(new TreeStore<BaseModel>(), new ColumnModel(columns));
treeGrid.setHeight(400);
return treeGrid;
}
private static void populateWithDummyData(final TreeGrid<BaseModel> treeGrid) {
final TreeStore<BaseModel> treeStore = treeGrid.getTreeStore();
treeStore.removeAll();
final List<BaseModel> parents = new ArrayList<BaseModel>();
for (int i=0; i<10; i++) {
final BaseModel parent = new BaseModel();
parent.set("name", "parent" + i);
parents.add(parent);
}
treeStore.add(parents, false);
for (int i=0; i<5; i++) {
final BaseModel child = new BaseModel();
child.set("name", "child" + i);
treeStore.add(parents.get(i), child, false);
}
}
If I add the TabPanel to a GWT VerticalPanel instead of a LayoutContainer, I get even weirder results; switching tabs and back and forth results in one of the TreeGrids does not render the fields at all, and the columns don't render properly either.
This all only happens in IE6, by the way.
What am I doing wrong? Is it because I am using setAutoHeight? Shouldn't I be able to use it?
public void onModuleLoad() {
final TabPanel tabPanel = new TabPanel();
tabPanel.setDeferredRender(false);
final TabItem rtTab = new TabItem();
rtTab.setLayout(new RowLayout());
rtTab.setHideMode(HideMode.OFFSETS);
final ContentPanel rtDataTreeGridCP = new ContentPanel();
final TreeGrid<BaseModel> rtDataTreeGrid = buildTestTreeGrid();
rtDataTreeGrid.setEnableColumnResize(false);
rtDataTreeGrid.setAutoHeight(true);
rtDataTreeGridCP.add(rtDataTreeGrid);
rtDataTreeGridCP.setHeaderVisible(false);
rtTab.add(rtDataTreeGridCP);
final ContentPanel rtTotalsTreeGridCP = new ContentPanel();
final TreeGrid<BaseModel> rtTotalsTreeGrid = buildTestTreeGrid();
rtTotalsTreeGrid.setEnableColumnResize(false);
rtTotalsTreeGrid.setHideHeaders(true);
rtTotalsTreeGrid.setAutoHeight(true);
rtTotalsTreeGridCP.add(rtTotalsTreeGrid);
rtTotalsTreeGridCP.setHeaderVisible(false);
rtTab.add(rtTotalsTreeGridCP);
//needed to load grid data into tab content before the corresponding tab is selected.
rtTab.setText("Real Time");
rtTab.setAutoHeight(true);
final TabItem ssTab = new TabItem();
ssTab.setLayout(new RowLayout());
ssTab.setHideMode(HideMode.OFFSETS);
final ContentPanel ssDataTreeGridCP = new ContentPanel();
final TreeGrid<BaseModel> ssDataTreeGrid = buildTestTreeGrid();
ssDataTreeGrid.setEnableColumnResize(false);
ssDataTreeGrid.setAutoHeight(true);
ssDataTreeGridCP.add(ssDataTreeGrid);
ssDataTreeGridCP.setHeaderVisible(false);
ssTab.add(ssDataTreeGridCP);
//needed to load grid data into tab content before the corresponding tab is selected.
ssTab.setText("Single Strat");
ssTab.setAutoHeight(true);
tabPanel.add(rtTab);
tabPanel.add(ssTab);
layoutContainer.add(tabPanel);
populateWithDummyData(rtDataTreeGrid);
populateWithDummyData(rtTotalsTreeGrid);
populateWithDummyData(ssDataTreeGrid);
RootPanel.get().add(layoutContainer)
}
private static TreeGrid<BaseModel> buildTestTreeGrid() {
final List<ColumnConfig> columns = new ArrayList<ColumnConfig>();
final ColumnConfig column = new ColumnConfig("name", "name", 500);
columns.add(column);
column.setRenderer(new WidgetTreeGridCellRenderer<BaseModel>() {
@Override
public Widget getWidget(BaseModel model, String property,
ColumnData config, int rowIndex, int colIndex,
ListStore<BaseModel> store, Grid<BaseModel> grid) {
// TODO Auto-generated method stub
final String text = model.get(property);
return new Text(text);
}
});
final TreeGrid<BaseModel> treeGrid = new TreeGrid<BaseModel>(new TreeStore<BaseModel>(), new ColumnModel(columns));
treeGrid.setHeight(400);
return treeGrid;
}
private static void populateWithDummyData(final TreeGrid<BaseModel> treeGrid) {
final TreeStore<BaseModel> treeStore = treeGrid.getTreeStore();
treeStore.removeAll();
final List<BaseModel> parents = new ArrayList<BaseModel>();
for (int i=0; i<10; i++) {
final BaseModel parent = new BaseModel();
parent.set("name", "parent" + i);
parents.add(parent);
}
treeStore.add(parents, false);
for (int i=0; i<5; i++) {
final BaseModel child = new BaseModel();
child.set("name", "child" + i);
treeStore.add(parents.get(i), child, false);
}
}