reordering of column in celltable

811 views
Skip to first unread message

tong123123

unread,
Jun 28, 2012, 11:33:37 PM6/28/12
to google-we...@googlegroups.com
current, the column order in CellTable is fixed in coding, that is, something like

    Celltable.addColumn(col1, "col1");
    Celltable.addColumn(col2, "col2");
    Celltable.addColumn(col3, "col3");
    ......
    Celltable.addColumn(col10, "col10");


1) if user want to change this column order (e.g. user want the col3 to be placed at the first column), there is impossible to do something like drag and drop to change the column order in CellTable ,right?
2) if we create a table like

    Strnig position
    col1     5
    col2     1
    col3     2
    ...
    col10   3

is it possible to use this table to dynamic change the ordering of column in the CellTable?

3) even worse, if one day user add one more row to the previous table like
col11 6
is it possible to automatically add this new column in the UI without changing code? (I really think this is impossible)

tong123123

unread,
Jun 29, 2012, 1:35:57 PM6/29/12
to google-we...@googlegroups.com
anyone has idea?
in fact, for the first requirement, I see GXT can do it as following link
http://www.sencha.com/examples/#ExamplePlace:basicgrid
but GXT can do it but GWT cannot?

I think it is common to allow user to change the column ordering in a table, but no method to do it in GWT?

Thomas Broyer

unread,
Jun 29, 2012, 3:03:26 PM6/29/12
to google-we...@googlegroups.com


On Friday, June 29, 2012 7:35:57 PM UTC+2, tong123123 wrote:
I think it is common to allow user to change the column ordering in a table, but no method to do it in GWT?

Have you seen a single Google product with reorderable columns? most of them don't even have sortable columns…
No I'm afraid it's not "that common"; and there are several ways of implementing it (including many without drag-and-drop) 
Message has been deleted

Thomas Broyer

unread,
Jun 30, 2012, 5:23:08 AM6/30/12
to google-we...@googlegroups.com


On Saturday, June 30, 2012 11:17:03 AM UTC+2, tong123123 wrote:
If  the celltable has something like
addColumn(Column<T,?> col, int insertIndex)

tong123123

unread,
Jun 30, 2012, 5:24:36 AM6/30/12
to google-we...@googlegroups.com
Oh, sorry, I overlook it.

Steve C

unread,
Nov 5, 2012, 7:52:14 PM11/5/12
to google-we...@googlegroups.com
I tried this, and it works, with two issues:

1. you need to remove the existing instance of the column.  Unlike regular DOM elements (and therefore Widgets), which can only be in one place at a time, the cells generate a rendered string, which will be a new snippet of HTML, which will be result in new DOM element.  And, apparently, nothing the table logic is policing the number of times a given column can appear, so the column will exist in two locations: the original location pushed one to the right if the insert position was before it, and the new location.

2. With a DatePickerCell, the first time I changed the date via the "popup", nothing happened in the table, but the column updater did get invoked, and refreshing the document, or just paging forward and back again, showed me that the update had taken, and I saw the new data.  Subsequent edits to cells in that column did reflect immediately in the table.

Code snippet:

private CellTable<Customer> ct = new CellTable<Customer>(pageRows);

// later, as the last column in the table:
Column<Customer, Date> expiresColumn =
    new Column<Customer, Date>(
        new DatePickerCell(DateTimeFormat.getMediumDateFormat())) {
    @Override
    public Date getValue(Customer cust) {
        return cust.getExpiration();
    }
};
expiresColumn.setFieldUpdater(new FieldUpdater<Customer, Date>() {
    @Override
    public void update(int index, Customer cust, Date value) {
        cust.setExpiration(value);
        custUpdater.updateCustomer(cust);
    }
});
TextHeader expiresHeader = new TextHeader("Expiration");
ct.addColumn(expiresColumn, expiresHeader);

// after finishing table setup, and adding everything to the Root Panel
int colIndex = ct.getColumnIndex(expiresColumn);
Column<Customer, ?> col = ct.getColumn(colIndex);
ct.removeColumn(expiresColumn);
ct.insertColumn(0, col, expiresHeader);
Reply all
Reply to author
Forward
0 new messages