Vaadin Crud UI. Axes are not sorted correctly

Question

Why am I getting my axes like this? How can I sort them currectly. I'm using Vaadin Crud component (not Grid).

Crud<OpvUser> crud = new Crud<>(OpvUser.class, createUserEditor());
crud.getGrid().addItemDoubleClickListener(e -> crud.edit(e.getItem(), Crud.EditMode.EXISTING_ITEM));

UserDataProvider dataProvider = new UserDataProvider();
crud.setDataProvider(dataProvider);
dataProvider.refreshAll();
     .....
crud.getGrid().setSortableColumns();
crud.getGrid().removeColumnByKey("password");
crud.addThemeVariants(CrudVariant.NO_BORDER);
add(crud);

You mean the "Liste von Benutzern" or what exactly? – Simon Martinelli Dec 06 '21 at 16:18 — Simon Martinelli, Dec 06 '21 at 16:18

score 3 · Accepted Answer · answered Dec 06 '21 at 18:55

3

I assume that you want to change the order of the columns, as that is one thing that stands out from the image you posted.

The Crud component builds a Grid internally, with columns automatically generated from the properties that exist in the bean class that you pass into the constructor (OpvUser in your case). Depending on how the properties in the bean class are defined, the order of colums might not be suitable. If you want to change the order of columns, you can call setColumnOrder on the grid. For your example, that should look something like this:

Grid<OpvUser> grid = crud.getGrid();
grid.setColumnOrder(
  // Columns keys are the exact property names of the bean class
  grid.getColumnByKey("id"),
  grid.getColumnByKey("firstName"),
  grid.getColumnByKey("lastName"),
  grid.getColumnByKey("email")
);

See the Crud docs for a full example, as well as the Grid API docs

answered Dec 06 '21 at 18:55

Sascha Ißbrücker

790
4
5

Sascha, Thank you for helping me. I tried this before but it doesent work, i get either NullPointer or nothing happens. I think the problem is in DataProvider class, Specifically in Comparator comparator(CrudFilter crudFilter) Mthode there is SortDirection function and i can only choose between (DESCENDING,ASCENDING). You Maybe cant unterstand what i mean that because iam not good at explaining. – Sayer Arab Dec 13 '21 at 11:02
Unfortunately it's not clear if you want to change the order of columns, or if you want to sort the rows. My answer was about changing the order of columns. To sort the grid programmatically I would suggest to review the Grid API docs for methods related to sorting (https://vaadin.com/api/platform/22.0.0/com/vaadin/flow/component/grid/Grid.html). If you are getting a null pointer, then maybe the column keys are not correct (I was just making assumptions from your screenshots), I would suggest to double check / debug which keys your columns actually have. – Sascha Ißbrücker Dec 14 '21 at 13:56
It works now thank you. Yes i meant to sort the columns, it works this way for me: crud.getGrid().setColumns("id", "firstName", "lastName", "email"); crud.getGrid().setColumnOrder(crud.getGrid().getColumns()); – Sayer Arab Dec 14 '21 at 15:12
Now the problem is that my Crud Button disappeared. I can only use the Button with ItemDoubleClickListener(), but the Butoon Icon aside my rows disappeared. Thank you for your help, it would be nice if you can help me again with the Crud Button – Sayer Arab Dec 14 '21 at 15:16
2

That's because you remove the edit column with your `setColumns` call. Please take a look at this example on how to setup the columns in the CRUD: https://github.com/vaadin/docs/blob/latest/src/main/java/com/vaadin/demo/component/crud/CrudBasic.java#L61-L86 – Sascha Ißbrücker Dec 14 '21 at 18:30

Vaadin Crud UI. Axes are not sorted correctly

1 Answers1