Specific element on top oflist CellTable/ Pager

Question

is it possible to have a specific element on top of the list?

backgoround: I have an event app, where new events are constantly added. The events are orderd by date. If an event passes, it is still on top of the page. Now that some time passed, the first elements are all over, so the first paged doesn't display any necassery data anymore. To get to events which will happen, the user has to click on the pager button. I want this events to be displayed on top, and if the user want's to see previous events, he has to click the back button of the pager.

What have I tried:

cellTable.setVisibleRange(overElements, (overElements + totalEementCount));

this mixes up the whole pager logic, and the user can't switch from pager to page anymore.

SingleSelectionModel<JSEvents> selectionModel = new SingleSelectionModel<JSEvents>();
...
selectionModel.setSelected(nextEvent, true);

this selects the right element, and moves the pager to it, but the other elements are still visible, so if I have a few "over" events and in the worst case, only have a single "comming" event in the table. Also it is the usability is bad, since the user has to look which event is next and doesn't have it on top of the page...

score 1 · Answer 1 · answered Jun 12 '12 at 15:59

1

If you're using a ListDataProvider, you can add the new event to the front of the list. Everything depending on that dataprovider will be notified and should redraw.

If you're using a different kind of data provider, you may have to call CellTable.redraw yourself, but I think AbstractDataProvider takes care of that for you.

As a first investigative step, you might just try calling cellTable.redraw() after your new event has been logged to see if that gets you anywhere.

answered Jun 12 '12 at 15:59

Riley Lark

20,660
15
80
128

could work, but I have my data orderd, so I can't controll the order and simply have the elements I want to display on top of the list. However I found a soltion and thanks for your idea :) – Stefan Jun 13 '12 at 07:47

score 0 · Accepted Answer · answered Jun 13 '12 at 07:45

found a solution: the celltable has a method setVisibleRange. This method is used in the examples when a pager involved:

            int start = display.getVisibleRange().getStart();
            int end = start + display.getVisibleRange().getLength();
            end = end >= data.size() ? data.size() : end;
            List<JSEvents> sub = data.subList(start, end);
            updateRowData(start, sub);

the updateRowData tells the celltable, which data is displayed and on which position this data starts.

Now if we want to have a speciffic element on top of the page we can use the same function. This is how I end up using it:

        int end = start + PAGESIZE;
        end = (end >= data.size()) ? data.size() : end;
        List<JSEvents> sub = data.subList(start, end);

        dataProvider.updateRowData(start, sub);
        cellTable.setVisibleRange(start, sub.size());

Specific element on top oflist CellTable/ Pager

2 Answers2