GWT DataGrid column width issue after removing columns

Question

In our GWT application we create a DataGrid and fill it with N columns. At some specific conditions we need to remove couple columns from the DataGrid. When we do so, we have get the problem that Column widths are shifted to the previous amount of columns resulting that the DataGrid doesn't take the full proper width.

Checking the Html code of the DataGrid, we have found out that after removing a Column from the DataGrid, colgroup element of the table contains col elements matching the previous old amount of columns. Thus those colgroup element is breaking the layout.

Resetting the column width, DataGrid width, calling DataGrid.redraw() don't help with this. Are there any workarounds or solutions?

Answer 1

This is a known issue, and a couple of (partial) workarounds have been proposed in the issue tracker. The issue had been diagnosed but to my knowledge no one took a stab at turning it into a patch, which is the only reason it's still not fixed nearly 4 years later (put differently: no one seems to care enough about it)

---

Note: the issue tracker is being moved to GitHub given the imminent shutdown of Google Code Hosting. If you read this and the link above doesn't work, try searching issues in the GitHub project

Answer 2

To keep the solution on this page(due to Google Code shutdown), I repost answer that was found on the link provided by Thomas Broyer:

public static void removeUnusedDataGridColumns(DataGrid<?> dataGrid) {
    int columnCount = dataGrid.getColumnCount();
    NodeList<Element> colGroups = dataGrid.getElement().getElementsByTagName("colgroup");

    for (int i = 0; i < colGroups.getLength(); i++) {
        Element colGroupEle = colGroups.getItem(i);
        NodeList<Element> colList = colGroupEle.getElementsByTagName("col");

        for (int j = colList.getLength()-1; j >= columnCount; j--) {
            colGroupEle.removeChild(colList.getItem(j));
        }
    }
}