I have a column like this, and i want it can sorted by touching into the header like sort in datagrid

  <column key="reasonField" header="Lý do"/>      @Supply(to = "externalAccountsDataGrid.reasonField", subject = "renderer")
private Renderer<ExternalAccountLog> externalAccountsDataGridReasonFieldRenderer() {
    return new ComponentRenderer<>(externalaccountlog -> {

        Span span = uiComponents.create(Span.class);
 if (externalaccountlog.getTransType().equals(ExternalAccountLogType.UNLOCKED.getId())) {
     span.setText(externalaccountlog.getReasonUnlock());
 } else if (externalaccountlog.getTransType().equals(ExternalAccountLogType.LOCKED.getId())) {
     span.setText(externalaccountlog.getReasonLock());
 }
        return span;
    });
}

i have a column like this, and i want it can sorted by touching into the header like sort in datagrid

Hi!

In a standard dataGrid, which is bound with collectionContainer, sorting occurs on the backed using container or loader:

In this case, you will have to sort the data in the collectionContainer manually. For example using the com.vaadin.flow.component.grid.Grid#addSortListener method.

However, before doing this, you may have to disable sorting in the corresponding container so that it does not interfere.

If the datagrid is not data bound, then everything becomes simpler. You will be able to use in-memory sorting. To do this, just define your comparator:

        usersDataGrid.getColumnByKey("myColumn")
                .setComparator((entity1, entity2) -> {
                    // comparation
                });

Best regards,
Dmitriy