Preset sorting in Grid

Flow
1

Hi folks.

I wan’t to preset my grid like in the picture.
So, that I don’t have to click the „Arrows“ to come to this state.

Is there any possibility?

Thanks a lot in advance.
I’m thankful for any advice.

Best, Frank
17299551.png

2

If you’re using the web component directly, you can set the direction attribute on the <vaadin-grid-sorter> element. Remember to also set the multi-sort attribute/property. It seems it’s not currently possible to define the order of the sorters, unless you are willing to use protected properties.

Relevant API docs:

Not sure how the same should be done from Flow, if you’re using Java.

3

Thank you for your response.

I wanted to do it in Java and found a solution.

I’m using the → UI.getCurrent().getPage().executeJavaScript(); function.
To ‘click’ the button from the code. → document.querySelectorAll(\"vaadin-grid-sorter\")[0] .click()

Best, Frank.

4

Also note that in the next platform release (Vaadin 12), Grid will have a public API to set the sort order from the server-side.

See [this issue]
(https://github.com/vaadin/vaadin-grid-flow/issues/200) for details.

–
Gilberto

5

My solution in Vaadin 14 Grid:

Grid<DataMessageTableItem> grid = new Grid<>();

Grid.Column<DataMessageTableItem> date = grid.addColumn(DataMessageTableItem::getDate)
                .setFlexGrow(1)
                .setHeader(loc.getValue(Databoxes_L.LABEL_DM_TABLE_DATE))
                .setSortProperty(dateSortProperty);
...
grid.addColumn(...);
grid.addColumn(...);
grid.addColumn(...);
...
 
GridSortOrder<DataMessageTableItem> order = new GridSortOrder<>(date, SortDirection.DESCENDING);
 
grid.sort(Arrays.asList(order));