View Full Version : GXT 2.2.4 Grid Header Groups cause header and body columns to be out of sync

18 Jul 2011, 10:18 PM
If a header group text is wider than the total width of the columns it spans then the header group's width will used in the header section, but the widths of the spanned columns in the body of the grid will not be expanded proportionally in the body of the grid causing the body and header not to line up.

This can easier occur by setting the widths of columns and that have a header group. The body columns will not line up with the header columns.


Here is the code that can reproduce this:

public class AnalystWorkspace implements EntryPoint
public void onModuleLoad() {
new MyWindow().show();

private class MyWindow extends Window {

public MyWindow() {
setLayout(new FitLayout());
setHeading("My window");

private ContentPanel getMainPanel() {
ContentPanel panel = new ContentPanel();
panel.setLayout(new RowLayout(Orientation.VERTICAL));
panel.add(getGrid(), new RowData(1, 1));

return panel;

private Grid<BaseModel> getGrid() {

ColumnModel cm = new ColumnModel(Arrays.asList(
new ColumnConfig("1", "1", 30),
new ColumnConfig("2", "2", 30),
new ColumnConfig("3", "3", 30),
new ColumnConfig("4", "4", 30)));

HeaderGroupConfig hgc1 = new HeaderGroupConfig("Group Header breaks columns in body", 1, 2);
cm.addHeaderGroup(0, 0, hgc1);

HeaderGroupConfig hgc2 = new HeaderGroupConfig("B", 1, 2);
cm.addHeaderGroup(0, 2, hgc2);

ListStore<BaseModel> store = new ListStore<BaseModel>();
for (int i = 1; i <= 3; i++) {
BaseModel m = new BaseModel();
m.set("1", i);
m.set("2", i);
m.set("3", i);
m.set("4", i);

Grid<BaseModel> grid = new Grid<BaseModel>(store, cm);

return grid;



My suggestions are to not force a width on the header, or if you do make sure to proportionally set the widths of all the columns that are grouped under that header.

I have done the second option as a workaround each time the grid is refreshed and I also had to catch manual resizes via the Grid firing ColumnResize Events and again proportionally resize the columns to match the header. This is a less than optimal workaround.


4 Jan 2012, 4:23 AM
Is there any feedback on this issue?

4 Jan 2012, 4:31 AM
Is there any feedback on this issue?

Currently not. All updates to the issues are always published in the threads.

4 Jan 2012, 4:48 AM
Is there any feedback on this issue?

I'm still stuck with proportionally setting the sub heading widths :(

1 Feb 2012, 7:36 AM
This happens cause the underline implementation has 2 html tables. Try to put a fixed width on the parent.

Hope it helps, first answer :D

1 Feb 2012, 2:02 PM
This happens cause the underline implementation has 2 html tables. Try to put a fixed width on the parent.

In my situation I can't put a fixed width as the text is dynamic. The framework should be setting the widths as needed.